smilehjl

品优购实战案例，对知识做一个回顾总结，里面有标准流、浮动，清除浮动、定位、字体突变css三角等常见知识点。

该文章主要概括了html5和css3中新加常用的特性，在日常开发中经常使用

该文章主要介绍了网站开发中常用到得高技巧，分别有精灵图、字体图标、CSS 三角、CSS 用户界面样式、vertical-align 属性应用、溢出的文字省略号显示、常见布局技巧、CSS 初始化等，值得一看

场景：类似网站广告，当我们点击关闭就不见了，但是我们重新刷新页面，会重新出现！本质：让一个元素在页面中隐藏或者显示出来。

详细的介绍的定位相关的知识点，可以实现快速了解和运用定位

主要介绍了清楚浮动的原理和常见的四种清除浮动的方法

浮动适用于那种盒子的并列布局CSS 提供了三种传统布局方式(简单说,就是盒子如何进行排列顺序)： 普通流（标准流） 浮动 定位标准流（普通流/文档流）所谓的标准流: 就是标签按照规定好默认方式排列.1. 块级元素会独占一行，从上向下顺序排列。 常用元素：div、hr、p、h1~h6、ul、ol、dl、form、table2. 行内元素会按照顺序，从左到右顺序排列，碰到父元素边缘则自动换行。 常用元素：span、a、i、em 等以上都是标准流布局，我们前面学习的就是标准流，标准流是最基

 分开写：border-top-left-radius、border-top-right-radius、border-bottom-right-radius 和。在 CSS3 中，新增了圆角边框样式，这样我们的盒子就可以变圆角了。 如果是正方形，想要设置为一个圆，把数值修改为高度或者宽度的一半即可，或者直接写为 50%CSS3 中新增了盒子阴影，我们可以使用 box-shadow 属性为盒子添加阴影。 该属性是一个简写属性，可以跟四个值，分别代表左上角、右上角、右下角、左下角。

网页布局的三大核心：盒子模型、浮动、定位

现在大部分笔记本电脑的屏幕分辨率都是1920px * 1080px，但是显示设置通常会默认设置放大125%，也就是DPI为125%。这样做的好处就是桌面上的软件看起来不会感觉太小，不好的地方就是各种软件也被相应的放大了125%，包括我们经常使用的浏览器，QQ客户端，微信客户端。简单来说就是我们的windows电脑默认按照1.25放大图片和浏览器等应用页面。所以我们在网页中浏览的页面或者图片都是比实际要大的。1 修改本机的DPI（缩放比） 修改成100%2 在浏览时 页面时，将缩放比缩小成80%

important 无穷大。场景：相同选择器给设置相同的样式，此时一个样式就会覆盖（层叠）另一个冲突的样式。 子元素可以继承父元素的样式（text-，font-，line-这些元素开头的可以继承，以及color属性）p标签没有对文字颜色进行设置，但div设置了，而div是p标签的父亲，所以就继承了div的属性，最后显示成粉色。5. 继承的权重是0， 如果该元素没有直接选中，不管父元素权重多高，子元素得到的权重都是 0。 样式冲突，遵循的原则是就近原则，哪个样式离结构近，就执行哪个样式。

 如果指定的两个值都是方位名词，则两个值前后顺序无关，比如 left top 和 top left 效果一致。把表格中的五个属背下来，然后写一下练习关于css的背景属性应该就有大概的了解了，但还是的在实践中加深巩固。 如果指定的两个值是精确单位和方位名词混合使用，则第一个值是 x 坐标，第二个值是 y 坐标。 如果参数值是精确坐标，那么第一个肯定是 x 坐标，第二个一定是 y 坐标。 如果只指定了一个方位名词，另一个值省略，则第二个值默认居中对齐。1. 参数是方位名词。2. 参数是精确单位。

定义：元素显示模式就是元素（标签）以什么方式进行显示，比如自己占一行，比如一行可以放多个。

后代选择器又称为包含选择器，可以选择父元素里面子元素。当标签发生嵌套时，内层标签就成为外层标签的后代。在 CSS 中，可以根据选择器的类型把选择器分为基础选择器和复合选择器，复合选择器是建立在基础选择器之上，对基本选择器进行组合形成的，通常用于集体声明. 并集选择器是各选择器通过英文逗号（,）连接而成，任何形式的选择器都可以作为并集选择器的一部分，伪类选择器很多，比如有链接伪类、结构伪类等，所以这里先给大家讲解常用的链接伪类选择器。常用的复合选择器包括：后代选择器、子选择器、并集选择器、伪类选择器等等。

文章主要介绍了css的简单介绍、css的基础选择器、css的字体属性、css的文本属性、css的引入方式、实战案例等相关知识点

2. cols=“每行中的字符数” ，rows=“显示的行数”，我们在实际开发中不会使用，都是用 CSS 来改变大小。使用场景: 当用户输入内容较多的情况下，我们就不能使用文本框表单了，此时我们可以使用 <textarea> 标签。使用场景: 在页面中，如果有多个选项让用户选择，并且想要节约页面空间时，我们可以使用标签控件定义下 拉列表。在英文单词中，input 是输入的意思，而在表单元素中 <input> 标签用于收集用户信息。在表单元素中，<textarea> 标签是用于定义多行文本输入的控件。

标签用于定义描述列表（或定义列表），该标签会与 <dt>（定义项目/名字）和<dd>（描述每一个项目/名字）一起使用。其基本语法如下：<dl><dt>名词1</dt><dd>名词1解释1</dd><dd>名词1解释2</dd></dl>1. <dl>

。2. 标签用于定义表格中的行，必须嵌套在 标签中。3. 用于定义表格中的单元格，必须嵌套在标签中。表格的主要作用：表格主要是用来展示数据的，使用表格来展示数据，数据可读性更好，更加规范。4. 字母 td 指表格数据（table data），即数据单元格的内容。1. 是用于定义表格的标签。单元格内的文字