CSS作业

11章   CSS简介

内部样式表

外部样式表

 行内样式表

 知识点：<div style="">   </div>

12章   CSS选择器 

 

 

 

 

 

 知识点：1、class选择器     .box{width:100px;height:100px;}

                2、id选择器     #box{width:100px;height:100px;}

                3、后代选择器   #father div{width:100px;height:100px;}

                4、群组选择器    h3,p{width:100px;height:100px;}

                5、元素选择器     div{width:100px;height:100px;}

 

13章   字体样式

 

 

 

知识点：

1、字体粗细font-weight

2、字体大小font-size

3、 字体风格font-style

4、字体风格font-style

14章   文本样式

 

 

 

 

 

知识点：

1、大小写text-transform

2、间距letter-spacing  word-spacing

3、首段缩进text-indent

4、水平对齐text-align

5、文本修饰text-decoration

6、行高line-height

15章  边框样式

 

 

知识点：

1、整体样式

2、局部样式

16章    列表样式

 

 

知识点：

1、列表项符号list-style-type    

        ol{list-style-type: lower-alpha;}

          ul{list-style-type: circle;}

2、列表项图片list-style-image

          ul{list-style-image: url();}

17章  表格样式

 

 

知识点：

1、表格边框合并border-collapse

2、表格边框间距border-spacing

3、表格标题位置caption-side 

 

18章  图片样式

 

 知识点：图片大小 边框 对齐

img{

                width: 100px;

                height: 90px;

                border: 2px dashed rgb(213, 185, 23);

            }

            #div1{text-align: center;}

            #img1{vertical-align: baseline;}

19章  背景样式

 

 

 

 

知识点：

1、背景图片固定background-attachment

2、背景图片位置background-position

3、背景图片样式background-image

4、背景图片重复background-repeat

5、背景颜色background-color

 

20章  超链接样式

 

 

 

 

知识点：

1、超链接伪类 

            a{text-decoration: none;}

            a:link{color: red;}

            a:visited{color: purple;}

            a:hover{color: yellow;}

            a:active{color: blue;}

2、深入了解hover

            div{

                width: 100px;

                height: 100px;

                text-align: center;

                background-color: burlywood;

            }

            div:hover{background-color: chocolate;}

3、鼠标样式

            #div-default{cursor: default;}

            #div-pointer{cursor: pointer;}

21章  盒子模式

 

 

 

 

 

知识点：

1、边框border

2、宽高width height

3、内边距padding

4、外边距margin

22章  浮动布局

 

 

 

知识点：

1、浮动            float: left;

2、清除浮动           .clear{clear: both;}

23章  定位布局

 

 

 

知识点 ：

1、绝对定位            position: absolute;

2、相对定位            position: relative;