- 常用的块状元素：、
、
、
- ,
- 常用的内联元素：、、
、、、、、、、、
常用的内联块状元素：,
每一个块级元素都从新的一行开始，并且其后的元素也另起一行。元素的宽度，高度，行高，以及顶和底边距都可设置。元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致），除非设定一个宽度。和其他元素都在一行上。元素的高度、宽度及顶部和底部边距不可设置。元素的宽度就是它包含的文字或图片的宽度，不可改变。和其他元素在一行上元素的高度、宽度、行高、以及顶和底边距都可设置display改变元素类型- block: 行内元素表现为块级元素
- inline： 块级元素显示为内联元素
- inline-block: 行内块元素
-
布局模型分类1、流动模型（flow） 2、浮动模型 3、层模型-
流动模型特点：1、==块状元素==都会在所处的包含元素内自上而下按顺序垂直延伸分布，因为在默认状态下，块状元素的宽度都为100%。实际上，块状元素都会以行的形式占据位置 2、==内联元素==都会在所处的包含元素内从左到右水平分布显示。 -
浮动模型：如果想让两个==块状元素==并排显示，设置float -
层模型：层布局模型就像是图像软件PhotoShop中非常流行的图层编辑功能一样，每个图层能够精确定位操作1、相对定位:(relative)相对于以前的位置移动，偏移前的位置保留不动。 2、绝对定位:(absolute)元素框脱离文档流，相对于其最接近的一个具有定位属性的父包含块进行绝对定位，如果不存在这样的包含块，则相对于浏览器窗口进行定位，定位后生成块级框。 3、固定定位:(fixed)与absolute定位类型类似，但它的相对移动的坐标是视图（屏幕内的网页窗口）本身。由于视图本身是固定的，它不会随浏览器窗口的滚动条滚动而变化（设置标题栏，导航栏）。拖动滚动条时位置固定不变。 ==使用absolute时父级元素要使用relative==
-
-
水平居中行内元素：text-align -
水平居中块级元素：margin：0 auto -
强制不换行div{ white-space:nowrap; } -
单行文本溢出overflow: hidden; text-overflow:ellipsis; white-space: nowrap; -
多行文本溢出overflow: hidden; text-overflow: ellipsis; display: -webkit-box; //将对象作为弹性伸缩盒子模型显示 。 -webkit-line-clamp: 3; //块元素显示的文本行数 -webkit-box-orient: vertical; //设置或检索伸缩盒对象的子元素的排列方式 -
首行缩进: text-indent: 2em; //首行缩进两个字符 -
行高: line-height该属性会影响行框的布局。在应用到一个块级元素时，它定义了该元素中基线之间的最小距离而不是最大距离。line-height 与 font-size 的计算值之差（在 CSS 中成为“行间距”）分为两半，分别加到一个文本行内容的顶部和底部。可以包含这些内容的最小框就是行框。
-
圆角边框: border-radiuslength 定义圆角的形状%以百分比定义圆角的形状
-
标签的href属性-
绝对 URL - 指向另一个站点（比如 href="http://www.example.com/index.htm"） -
相对 URL - 指向站点内的某个文件（href="index.htm"） -
锚 URL - 指向页面中的锚（href="#top"）锚的使用：
首先，我们在 HTML 文档中对锚进行命名（创建一个书签） <a name="tips">基本的注意事项 - 有用的提示</a> 然后，我们在同一个文档中创建指向该锚的链接： <a href="#tips">有用的提示</a>
-
- 、
- 、、、
、
块级元素特点 block内联元素特点 inline内联块状元素特点 inline-block
布局模型###css是如何实现在页面文字不换行、自动换行、强制换行的自动换行``` div{ word-wrap: break-word; word-break: normal; } ```强制英文单词断行``` div{ word-break:break-all; } ``` - 常用的内联元素：、、