css嵌套

css嵌套，.mark p为class=mark下的p元素设置样式。

p.mark为 p下class=mark的标签设置样式

p{}

.mark{}

.mark p{}

p.mark{}

p
{
    color:blue;
    text-align:center;
}
.marked
{
    background-color:red;
}
.marked p
{
    color:white;
}
p.marked{
    text-decoration:underline;
}
        <p>这是居中的蓝色文字</p>
    <div class="mark">
        <p>这段文字有红色背景，白色、居中文字</p>
    </div>
    <p>所有class="mark"元素内的p元素指定样式，但有不同的文本颜色</p>
    <p class="mark">这段文字有下划线，蓝色居中文字</p>
    

css设置三种标签种类：

块元素属性block

行内块元素inline-block ,通常把span设置为行内块。

行内元素inline

border: 1px solid red;

设置后可以调整SPAN等元素高宽