2023.11.17-2023.11.23课后练习

2023.11.17第十六章--第二十章

第十六章列表样式

1.练习第十六章列表样式，包括列表项符号和列表项图片。定义列表项符号用list-style-type，属性取值分无序和有序；去除列表项目符号属性值用：none。定义列表项照片用list-style-image:url(图片路径）。

2.

第十七章表格样式

1.表格样式包括表格标题位置、表格边框的合并、表格边框间距。标题位置caption-side有top和bottom两个属性值，边框合并border-collapse包括separate和collapse两个属性值，边框间距border-spacing用像素值来定义。边框合并和边框间距要在table元素里面定义。

2.

第十八章图片样式

1.图片样式包括图片大小、图片边框、图片对齐方式和文字环绕方式。图片大小在img里用width和height来设置。图片边框用border属性定义，包含边框的宽度、样式和颜色这三要素，图片对齐有水平对齐和垂直对齐，图片的对齐方式要在父元素中设置，水平对齐text-align包含left、center和right三个属性值，垂直对齐vertical-align包含top、middle、baseline和bottom四个属性值。文字环绕float由left和right属性值来设置。

2.

第十九章背景样式

1.背景样式包括背景样色和背景图片。背景颜色用background-color属性设置，color是用来定义文本颜色的；背景图片样式的属性有：background-image(定义背景图片地址）、background-repeat(定义背景图片重复的方式）、background-position(定义背景图片位置）、background-attachment(定义背景图片固定）。背景图片的重复方式有默认值、只在水平方向、只在垂直方向和不重复。背景图片位置有关键字和像素值两种设法，都要写水平距离和垂直距离，两者用空格隔开，图片背景的位置是相对于所在元素的位置。背景图片固定有scroll和fixed两个属性值设置背景图是否和元素一起滚动还是固定不动。

2.

第二十章超链接样式

1.超链接样式的超链接伪类可以设置超链接在鼠标单击的不同时期的样式。四个伪类link、visited、hover、active顺序不能改变。a:link是元素未访问时样式；a:visited元素访问后的样式；a:hover是鼠标经过时样式；a：active是鼠标单击激活时样式。一般大多数情况只用为访问时状态和鼠标经过状态。“:hover”伪类可以定义任何一个元素在鼠标经过时的样式。鼠标样式有浏览器鼠标样式和自定义鼠标样式，用cursor属性定义鼠标样式，一般会用到default、pointer和text。自定义鼠标样式可以用一些鼠标图片来设置。

2.

2023.11.19第二十一章盒子模型

1.回顾了课上讲的关于盒子模型的知识点。盒子模型包括4个属性：content、padding、 margin、border。内容区是盒子必备的组成部分，可以是文本、图片等多种类型，其中内容区不包括padding部分；内边距定义内容与边框之间的间距；外边距是两个盒子之间的距离，可能是子元素与子元素之间的距离，也可能是子元素和父元素之间的距离；边框可以类比之前学的边框内容。设置宽高是针对内容区而言，并且只有块元素可以设置宽高，行内元素设置宽高无法生效。内边距和外边距都有三种简写方式。对margin局部样式当既有父元素又有兄弟元素时，margin布局是相对于该方向的兄弟元素，没有兄弟元素时就是相对父元素。浏览器审查元素通过浏览器自带的控制台可以查看盒子模型的数据，辅助开发很实用。

2.

2023.11.20第二十二章浮动布局

1.正常文档流也就是普通流，块元素独占一行，相邻行内元素在每一行中按照从左到右在该行排列。改变正常文档流可以用浮动和定位，浮动属性值有left和right，分别对应向左浮动和向右浮动，清除浮动用clear，有left和right和both属性，一般用both属性用的多。

2.

2023.11.21第二十三章定位布局

1.定位布局主要包括固定定位、相对定位、绝对定位和静态定位。固定定位和绝对定位都是相对浏览器而言来设置位置的，相对定位是相对该元素之前的位置而言，如果一个元素变成绝对定位，就脱离了文档流，则该元素就会浮于其他元素上面，静态定位是元素定位属性的默认值。

2.

2023.11.23 div+css教程一列布局

1.学习如何固定一列布局的宽度，自适应宽度，定位居中，一列多个块元素的定位布局等知识点。

2.