行内元素和块级元素
- 行内元素
常见的行内元素有（a、span、img、input、label、em、strong、button、code、br、select、textarea、script） - 行内元素只能包含文本和行内元素
- 行内元素不能设置宽高，不过可以设置行高
- 行内元素根据自身宽度占用空间
- 行内元素设置内边距时左右有效，上下内边距会撑开，但不会影响其他元素的位置；设置外边距时，只对左右两边有效。
- 块级元素
常见的块级元素有（div、p、h1~h6、form、li、ul、ol、dl、table、hr、
dd、dt、tr、td、th） - 块级元素内可以包含块级元素也可以包含行内元素
- 块级元素可以设置宽高
- 块级元素占据一整行的空间
- 块级元素可以设置内外边距，在设置外边距的时候，上下两个块级元素会出现外边距重叠合并的情况
CSS继承，那些可以继承哪些不可以继承
- color属性可以继承；
- border属性不会继承，大多数框模型属性（内外边距、背景、边框）都不能继承；注意，继承的值没有特殊性
如何分别让块级元素和行内元素水平居中
- 对于块级元素
通过设置width:0px; margin： 0px auto;即可实现水平居中 - 对于行内元素
通过设置在其父元素下设置text-align:center;即可该行内元素实现水平居中
用 CSS 实现一个三角形
图片.png
效果如下，同样可以对其它几个边进行相同调整，从而实现不同样式的三角形。
图片.png
实现单行文本溢出加 ...
通过红框内的属性设置出单行文本溢出...效果
图片.png
效果如下：
设置前
设置后
px, em, rem 的区别
- px像素（Pixel）是作为一个固定的像素单位,相对于显示器的分辨率而言的；
- em是作为一个相对长度单位，相对于其父元素的大小来确定自身大小；
- rem是作为一个相对长度单位，相对于其根元素的大小来确定自身大小；大多数浏览器都以支持rem，对于不支持的浏览器多写一个绝对单位的声明，font-size： 14px; font-size: .875rem;
下面代码的作用?为什么要加引号? 字体里\5b8b\4f53代表什么?
图片.png
网友评论