1、块级元素和行内元素分别有哪些,有什么区别?
常见block:
div、h1~h6、p
from/ul/dl/ol/table
li/dd/dt/tr/td/th常见inline:
span、em、a、br、img、button
input、labbel、textarea、select区别:
1、block包含块级和行内,而行内只包含文本和行内
2、block占据一整行空间,行内占据自身宽度空间
3、宽高设置只对块级元素(block)生效、行内元素(inline)设置无效
4、块级元素可设置4个方向的内外边距,而块级元素只对设置左右内外边距有效。
2、什么是CSS继承,哪些属性可以,哪些不行?
- CSS继承:应用样式的元素后代会继承样式的某些特性
- 能继承的元素:letter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction、list-style、list-style-type、list-style-position、list-style-image、text-indent和text-align
- 不能继承:display、margin、border、padding、background、height、min-height、max-height、width、min-width、max-width、overflow、position、left、right、top、bottom、z-index、float、clear、table-layout、vertical-align、page-break-after和page-bread-before
3、如何让块级元素居中?如何让行内元素水平居中?
- 块级元素居中:
margin:0 auto
- 行内元素居中:
text-align : center
4、用CSS绘制三角形、圆角边框
https://joinmouse.github.io/border/index.html
5、单行文本溢出加 ...如何实现
主要运用下面三句语法:
-
white-space:nowrap
//告诉文本不换行 -
overflow:hidden
//将文本溢出的需要隐藏掉 -
text-overflow:ellipsis
//将溢出部分变为三个...
6、 px、em、rem有什么区别?
- px实际上就是像素,用px设置字体大小时,比较稳定和精确。但是这种方法存在一个问题,当用户在浏览器中浏览我们制作的Web页面时,如果改变了浏览器的缩放,这时会使用我们的Web页面布局被打破。这样对于那些关心自己网站可用性的用户来说,就是一个大问题了。因此,这时就提出了使用“em”来定义Web页面的字体。
- em就是根据基准来缩放字体的大小。em实质是一个相对值,而非具体的数值。这种技术需要一个参考点,一般都是以的“font-size”为基准。
- rem,em是相对于其父元素来设置字体大小的,这样就会存在一个问题,进行任何元素设置,都有可能需要知道他父元素的大小。而rem是相对于根元素,这样就意味着,我们只需要在根元素确定一个参考值。
7、解释下面代码的作用?为什么要加引号? 字体里\5b8b\4f53代表什么?
回答:设置font-family字体,由于字体中间有空格加引号是为了识别成两个元素。在我们编写网页时候、css 编码是 utf8 时,某些情况下直接写:宋体、微软雅黑之类的中文字体名字,会出现不能识别导致字体设置失效的问题,如果把字体名字转成对应编码‘\5b8b\4f53’,就不会出现这个问题