CSS体系 一.今天学习的内容 9:00-20:00 1.文字属性 ①字体外观 ②字体粗细 ③字体的复合属性 2.文本属性 ①文本颜色 ②RGB代码 ③文本对齐 3.文本装饰 使用属性是text-decoration 4.文本缩进 属性是text-indent 控制首行缩进 5.行间距 属性是line-heigth 6.文本换行 属性white-space 7.CSS的引入方式 ①行内样式表（行内式） ②内部样式表（嵌入式） ③外部样式表（链接式） 8.Emmet语法 可以提高HTML和CSS的编写速度 输入div 按tab键能快速补全标签 ①一次生成多个标签 div*5 ②生成父子级关系标签 div>p ③生成兄弟关系标签 div+p ④生成带有类名为demo的p标签 p.demo ⑤生成带有id属性的标签 ⑥使用自增符号生成顺序内容 ⑦生成标签时直接添加内容 ⑧快速生成css代码 9.CSS的复合选择器 对基础选择进行组合而形成的选择器 ①后代选择器 后代选择器又叫做包含选择器，是选择某个父元素下面的子元素。 语法：元素1 元素2 {样式声明} 选择元素1中的所有元素2（所有复合条件后代都可以被选中不局限于到底是儿子还是孙子） ②子选择器 子元素选择器就是只能选择复合条件的最近的一级子元素，简单来说就是选亲儿子元素 语法 元素1 > 元素2 {样式声明} 表示选择元素1里面最近的一级元素2 ③并集选择器 并集选择器就是用多组标签来构成，同时为他们定义相同的样式，通常用于集体样式声明，并集选择器中的各选择器之间用逗号隔开。 ④伪类选择器 链接伪类选择器 :link 选择所有未访问过的链接 :visited 选择所有已经被访问的链接 :hover 选择鼠标指针悬浮的链接 :active 选择所有鼠标点击时的链接 ⑤焦点伪类选择器 :focus 伪类选择器用于选取获得焦点的表单元素，一般情况下在<input>表单元素中使用 10.元素显示模式 ①块元素 <h1>~<h6>、<p>、<div>、<ul>、<ol>、<dl>等等 自己独占一行 高度宽度可以自由设置 宽度默认是父级宽度的100% 块级元素内可以放行内元素、行内块元素或者块元素 文字类的元素中不要使用块元素（如果使用会造成语义混乱） ②行内元素 <span>、<strong>、<em>、<ins>等等 相邻的行内元素在一行上显示，一行可以显示多个 宽和高设置无效 默认的宽度是它本身内容的宽度 行内元素只能容纳文本或者其他行内元素 ③行内块元素 <img>、<input>、<td>等等，同时具有块元素和行内元素的特点。 相邻的行内块元素在一行上显示，但是它们之间会有空白间隙。（行内元素特点） 宽高可以设置（块级元素特点） 默认宽度是它本身内容的宽度（行内元素的特点） ④元素模式的转换 转换为块元素：display:block; 转换为行内元素：display:inline; 转化为行内块元素：display:inline-block; 21:00-23:00 1.img图像标签 属性名：src 属性值：图片的路径 属性名：alt 属性值：替换文本 作用：在图片不能正常显示的情况下的文本提示 属性名：title 属性值：文本 作用：鼠标停留在图片上时的提示文本 属性名：width 属性值：像素 作用：设置图片宽度 属性名：height 属性值：像素 作用：设置图片的高度 属性名：border 属性值：像素 作用：给图片添加边框 2.超链接语法和分类 ①外部链接 ②内部链接：网站内部页面之间的链接 ③空链接：如果没有确定链接目标时，可以使用空链接 如果href的地址时一个文件或者压缩包，那么点击之后会下载这个文件 网页元素作为链接入口：在页面中的各种网页元素，比如文本、图片、表格、音频、视频等等都可以添加超链接 锚点链接：点击某个链接，跳转到当前页面的某个位置 ④表格标签 表格的基本语法 <table></table>标签用于定义表格 <tr></tr>标签用于定义表格中的行（table row），必须要嵌套在<table></table>中 <td></td>标签用于定表格中的单元格（table data），必须要嵌套在<tr></tr>中 <th></th>标签用于定义行中的内容是表头内容，表头内的字体会加粗并且居中对齐 3.表格的属性 align 规定表格的对齐方式 属性值：left、center、right border 规定表格的边框 属性值：1或者"" width 规定表格的宽度 属性值：像素值 cellspacing 控制单元格之间的空白，默认是2像素 属性值：像素值 cellpadding：控制单元格里面的内容和单元格边框之间的空白，默认是1像素 属性值：像素值 4.表格的结构标签 表格中用<thead></thead>标签来表示头部区域，<tbody></tbody>来表示表格的主体区域，这样可以更好的区分表格结构，方便后期的元素定位。 合并单元格 先找到目标单元格 跨行合并使用rowspan=“合并单元格的个数” 跨列合并使用colspan=“合并单元格的个数” 将被合并的单元格删除掉 二.今天遇到的问题 1.逻辑符号打错导致无法生成页面 2.英语单词写错 三.问题解决方法 1.多复习,多练习,把复杂的代码都记住 2.不懂的单词和代码抄写下来,每天利用时间背诵
| 
