做day5~6的作业时，第一个小作业中想将前两个板块的元素改成行内的：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>うまるちゃん</title>
<link rel="stylesheet" type="text/css" href="css/style_1.css" />
</head>
<body>
<div>
<h1>うまるちゃん</h1>
</div>
<div>
<h2>設定</h2>
<h3 class="inline">お名前</h3>
<p class="inline">土間 埋 （どま うまる）</p>
<h3 class="inline">化名</h3>
<p class="inline">U.M.R</p>
<h3 class="inline">住所</h3>
<p class="inline">タイヘイとアパート『コーポ吉田』の201号室</p>
</div>
<div>
<h2>経験</h2>
<h3 class="inline">学校</h3>
<p class="inline">名門・荒矢田（あらやだ）高校</p>
</div>
<div>
<h2>個人情報</h2>
<h3>好きな食べ物</h3>
<li>コーラ</li>
<li>お菓子</li>
<li>唐辛子</li>
<h3>ペット</h3>
<p>ハム次郎、哈姆三郎</p>
</div>
<div>
<h2>登場人物</h2>
<h3>兄</h3>
<p>土間 大平（どま たいへい）</p>
<h3>友人</h3>
<li>海老名 菜々（えびな なな）</li>
<li>橘・シルフィンフォード（たちばな・シルフィンフォード）</li>
<li>本場 切絵（もとば きりえ）</li>
</div>
</html>
就这样，我给display需要变成inline的标签带上了class，本来，简简单单，写个类选择器就好了，但是，我写选择器的时候画蛇添足，类选择器+派生选择器，然后就毫无作用：
body {
font-family: sans-serif;
}
p, h3, li {
font-size: 14px;
}
.inline p {
display: inline;
}
.inline h3 {
display: inline;
}
具体我没想出来为啥，但是只写成类选择器就work了：
body {
font-family: sans-serif;
}
p, h3, li {
font-size: 14px;
}
.inline {
display: inline;
}
CSS学习笔记：inline和inline-block的区别
inline和inline-block的区别
px-em-rem-different
设置行距
网友评论