CSS常见样式

块级元素和行内元素分别有哪些?动手测试并列出4条以上的特性区别

  • 块级元素(block-level)
    div h1 h2 h3 h4 h5 h6 p hr
    form ul dl ol pre table
    li dd dt tr td th
  • 行内元素(inline-level)
    em strong span a br img
    button input label select textarea
    code script
    特性区别
    1. 块级元素会独占一行(即无法与其他元素显示在同一行内,除非你显式修改元素的 display 属性),而内联元素则都会在一行内显示。
    2. 块级元素可以设置 width、height 属性,而内联元素设置无效。
    3. 块级元素的 width 默认为 100%,而内联元素则是根据其自身的内容或子元素来决定其宽度。
    4. 块级可以包含块级和行内,行内只能包含文本和行内。

什么是 CSS 继承? 哪些属性能继承,哪些不能?

CSS继承
所有的CSS语句都是基于各个标记之间的父子关系,继承就是子标签继承了上级标签的CSS样式的属性。

  • 继承属性
    所有元素可继承:visibility和cursor。
    内联元素可继承:letter-spacing、text-transform、direction。
    终端块状元素可继承:text-indent和text-align。
    列表元素可继承:list-style、list-style-type、list-style-position、list-style-image。
  • 不可继承
    不可继承的: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和unicode-bidi。

如何让块级元素水平居中?如何让行内元素水平居中?

  • 块级元素水平居中
    margin:0 auto;
  • 行内元素水平居中
    text-align:center;

用 CSS 实现一个三角形

CSS常见样式_第1张图片
triangle.jpg

单行文本溢出加 ...如何实现?

CSS常见样式_第2张图片
overflow.jpg

px, em, rem 有什么区别

  • px: 固定单位
  • 百分比(宽高?文字大小?line-height? position?)
  • em: 相对单位,相对于父元素字体大小
  • rem: 相对单位,相对于根元素(html)字体大小
  • vw vh: 相对单位,1vw 为屏幕宽度的1% 兼容性

解释下面代码的作用?为什么要加引号? 字体里\5b8b\4f53代表什么?

3.jpg
  • 作用:在body元素font属性中,font-size为12px,font-height为字体的1.5倍,font-family为tahoma字体,arial,“”Hiragino Sans GB“”字体,'\5b8b\4f53'字体,sans-serif字体,以顺序优先级使用。
  • 因为中间有空格,不加引号会被识别成两个元素。
  • 数字符号表示的是字体的编号。

你可能感兴趣的:(CSS常见样式)