入门任务9

  1. text-align: center的作用是什么,作用在什么元素上?能让什么元素水平居中
    text-align:center的作用是让行内元素水平居中,作用在行内元素上。
  2. IE 盒模型和W3C盒模型有什么区别?
    W3C盒模型height和width只作用在内容上,不包括padding和margin。
    IE盒模型的height和width包含padding和margin。
  3. *{ box-sizing: border-box;}的作用是什么?
    整个页面的盒模型全部设置为IE盒模型。
  4. line-height: 2和line-height: 200%有什么区别?
  • line-height:2相对于字体本身扩大2倍。
  • line-height:200%相对于父级扩大2倍。
  1. inline-block有什么特性?如何去除缝隙?高度不一样的inline-block元素如何顶端对齐?
  • inline-block既有inline的特性,又有block的特性,不占据一整行,宽度右内容决定,可以设置width,height,padding,margin。
  • 去除缝隙


    image.png

    或者


    image.png
  • 顶端对齐 vertical-align:top
  1. CSS sprite 是什么?
    CSS精灵图,指将不同的图标合并在一张图上,减少网络请求,优化性能。
  2. 让一个元素"看不见"有几种方式?有什么区别?
  • opacity:0,元素依然存在只是透明度为0。
  • visibility:hidden,和opacity:0类似。
  • display:none,元素消失,页面上不存在。
  • background-color: rgba(0,0,0,0) 背景色变为透明。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容