third weenkend

不说情况了，直接都是就好了。我是看自己学的整体进行梳理的。

css的三种声明

全局声明

   * {	text-align:center}

即为对全局的声明，我个人认为这是对页面的整体风格的一种比较重要的应用，还是比较方便的。
如下图，页面的所有内容都居中显示

集体声明

h3,h4 // 这里有一个逗号，即加了逗号就意味着对h3和h4进行同时应用
{ font-size:30px;
color:blue;
font-weight:bold;
letter-spacing:10px; //为字符的间距
line-height:40px; //行高，之间的距离
text-decoration:overline; //装饰的线，有overline、line-through、none
}

集体声明对于两个或多个选择器重复的时候使用还是很方便的，可以省去一些不必要的时间

嵌套声明

p span{ // 注意：p和span中间有一个空格，即这个为嵌套声明的格式
font-size:50px;
color:black;
font-weight:bold;

<p> <span> 老兄呀</span>可以呀</p>

嵌套的意思就是在两个中间才会起作用，这个通常可以用来对新闻内容的开头等等强调或者分开之类的应用。也算是比较重要的了

css的三种选择器

标签选择器

这里给两个例子吧。

格式即为word{想要的内容}
p{
font:bold italic 30px/1.5em ‘宋体’; //此为整体进行书写，依次为 粗体、斜体、字号、字间距、字体类型
color:#230;
}
table{
width:300px;
height:200px;
border-collapse :collapse;
}

最基础的用法，也是最重要的用法

类别选择器

.one // 前面的.是类型选择器的标志
{
font-size:20px;
color:red;
}

<p class="one">.one选择器类别</p>	//class对应为选择的意思 一定要加上 格式如此 意思就是选择one
<p>p选择器的</p>

这里同时涉及到一个子父关系的知识点，
大体来概述就是 p是父，one是子，
p有的one没有的，one会继承过来，如上述中的斜体等
而p有的one也有的，那么one会用自己的，如上面的颜色等

ID选择器

#hhh{ //格式为#标签{}
font-size:50px;
color:black;
text-align:justify; // justify为水平对齐文本对齐，就像写作文一样*/
}

而ID大体都与类别相同，就不一一介绍了，不同的的是他不可混合使用。

<p class="two one">混合使用的</p>
<p id="one hhh"> 混合的ID选择器</p>
如图：

此时的类别选择器会显示one选择器的内容，顺序为head中编写的顺序，而不是body中class选择的顺序。
而对应的ID选择器就会乱套了，因为我IDhhh中的color为red，IDxxx的color为blue，怎么都不可能显示黑色的。

css的超链接

共有四种类型
a:link{} // 未访问时的状态
a:visited{} // 已访问后的状态
a:hover{} // 鼠标悬停时的状态
a:active{} // 鼠标点击瞬间的状态

这里放一张图就好了，主要应用有鼠标悬停时字体变大便于浏览、以及浏览过的网页后的颜色是怎样的等等

css的列表list属性

介绍三种类型
list-style-type:; // type为设置标签开始那个点点的样式
list-style-position:; // 标签所在的相对位置
list-style-image:; // image为标签的背景图
这里也是放两张图进行介绍就好了

css的背景

介绍三种类型
back-ground-color:; // 背景的颜色
back-ground-image:; // 背景图片
back-ground-repeat:; // 背景的填充方式

div{
width:500px;
height:500px;
background-color:red;
background-image:;
background-repeat:repeat-x;
// repeat为填充的方式 有X Y no-repeat*/
}

<div >	</div>

原谅我填充那个内容打不出来，所以看不到效果，这里简单放一点示例吧

css的表格

table{
width:300px;
height:200px;
border-collapse :collapse;
}
其中collapse是消除表格边框的距离，想了解的可以去看之前博客的表格与现在这个表格的区别。

同时这里介绍奇偶选择器，下面的表格功能借助其实现，目的是为了让表格看起来有层次感。

tr:nth-child(odd){
background-color:#EAF2D3;
}
tr:nth-child(even){
background-color:#DBF2E5;
}
格式为 标签:nth-child(odd|even){}

总结

小结一下吧，这周总算把css基础知识基本都搞定了，然后总体评价一下CSS和HTML。
都说HTML是负责界面设计，CSS负责界面的内容样式管理，我觉得总结的挺到位的吧，因为确实CSS写起内容起来比较方便。
然后鼓舞一下自己吧，后面就要接触综合的应用了，其实基础我认为了解，理解，吃净。懂其中很著名的应用。呃呃呃，就很棒棒了。
至于后面的日子，那就继续FIGHTING吧