【牛腩新闻发布系统】——CSS初识

前言

　　最近学习了牛腩，在界面设置部分涉及到了一个新的学习内容——CSS

　　刚刚上手比较生疏，所以总结一下以供加深理解

　　但是只有在理论支持的基础上多多实践才能更加的熟练。

正文

　　CSS层叠样式表（Cascading Style Sheets）是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。　　　　　　　　　　－－百度百科

　　我们利用CSS能够真正的使网页的内容与样式分离。

　　

　　标签和选择器

　　　在HTML中为所需要显示的内容设置标签，

　　　在CSS文件中利用选择器根据标签为对应的内容设置格式。　　

　　整文以class标签和id标签为例（据我的了解范畴，不清楚是否还有其他标签）

　　选择器的优先级：

　　　id选择器>class选择器>HTML标签选择器

　　标签设置

　　标签基本格式：

<span class="标签名">显示内容</span>
<span id="标签名">显示内容</span>

　　连续设置标签

　　标签名以空格分隔

<span class="标签名1 标签名2">显示内容</span>

　　同一内容设置不同标签

<span id ="标签名1" class="标签名2">显示内容</span>

　　嵌套的标签

<span class="标签名">这是<span>需要</span>显示的内容</span>

　　选择器设置

　　选择器基本格式

　　class选择器

.标签名 { 
  格式;
}

　　id选择器

#标签名 {
   格式;
}

　　父子选择器

　　父子选择器中间用空格隔开，只对选择器中的内容设置此格式

父选择器 子选择器 { 
　格式；
}

　　与嵌套标签为对应关系，以上面的标签嵌套为例：

　　即，为“需要”两个字设置大小为10个像素大小。

.标签名　<span>{
font-size:10px;
}

　　

　　选择器的并列设置

　　在HTML中两个标签统一设置为此格式，与上面类标签的连续设置无直接联系

.标签名1, .标签名2 {
格式；

　　同一内容，设置多个标签，通过选择器设置的格式有冲突

　　设置格式产生冲突的选择器类型相同时：

　　　根据在CSS文件中选择器放置的位置决定。

　　　　代码中后执行的选择器执行的结果会覆盖先执行的选择器对内容的格式设置

　　　　选择器的执行顺序为自上向下顺序执行。

　　设置格式产生冲突的选择器类型不同时：

　　　根据选择器的优先级决定。

　　　　优先级高的会覆盖优先级低的执行结果

结语

　　　　　　　　　　勇敢的往前走