入门任务8

  1. 块级元素和行内元素分别有哪些?动手测试并列出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 span strong a链接 br img button input label select textarea code script


    image.png
  • 块级元素占据整行空间,行内元素占据自身得高度宽度
  • 块级元素可以设置宽高,行内元素不能设置
  • 块级元素可以包含行内元素,行内元素只能包含文本和行内
  • 块级元素可以调整margin和padding,行内元素只能调整左右的margin和padding,不能调整上下的margin和padding。
  1. 什么是 CSS 继承? 哪些属性能继承,哪些不能?
  • CSS得属性可以向下继承,子元素可以继承父元素得属性。
  • color,font可以继承
  • border,margin,padding不可继承
  1. 如何让块级元素水平居中?如何让行内元素水平居中?
  • 块级元素水平居中:margin:0 auto
  • 行内元素水平居中:在父元素设置text-align:center
  1. 用 CSS 实现一个三角形


    image.png
  2. 单行文本溢出加 ...如何实现?
    white-space:nowrap
    overflow:hidden
    text-overflow:ellipsis


    image.png
  3. px, em, rem 有什么区别
  • px固定单位,像素
  • em相对单位,相对于父元素字体大小
  • rem相对单位,相对于根元素字体大小
  1. 解释下面代码的作用?为什么要加引号? 字体里\5b8b\4f53代表什么?
    body{ font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif; }
  • 页面字体大小为12px,行高为1.5倍,后面为字体得优先级,选择顺序
  • 加引号因为中间有空格,不加会被当作两种字体
  • \5b8b\4f53代表宋体
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 块级元素和行内元素分别有哪些?## 块级元素 行内元素 区别 块级元素可以包含行内元素和其他块级元素,行内元素只能...
    饥人谷_zhangfan阅读 346评论 0 0
  • 1、块级元素和行内元素分别有哪些?动手测试并列出4条以上的特性区别 2、什么是 CSS 继承? 哪些属性能继承,哪...
  • 1.块级元素和行内元素分别有哪些?动手测试并列出4条以上的特性区别块级元素有 p、div、form 、 ul、 ...
    _小黑阅读 428评论 0 0
  • 块级元素和行内元素分别有哪些?动手测试并列出4条以上的特性区别 块级元素:div h1 h2 h3 h4 h5 h...
    Tuuu阅读 237评论 0 0
  • 荏苒三年,时光短暂, 专业知识,科研实践, 探究未知,历练磨难, 学成毕业,走出校园, 广阔天地,任由施展。 三年...
    秋波送给你阅读 647评论 0 3