css常见样式2

1.text-align: center的作用是什么,作用在什么元素上?能让什么元素水平居中

text-align:center是让行内文本水平居中;作用在块状元素的文字和Img上以及display为inline或inline-block的容器上;让内联元素在父级块状元素中居中。

2.IE 盒模型和W3C盒模型有什么区别?

<strong>W3C盒模型</strong>


Paste_Image.png

<strong>IE盒模型</strong>


Paste_Image.png

W3C盒模型的宽高等于填充物的宽高,IE盒模型的宽高包括border和padding。

3.*{ box-sizing: border-box;}的作用是什么?

指定所有元素都为IE盒模型。width = border + padding + 内容的 width;
height = border + padding + 内容的 height。

4.line-height: 2和line-height: 200%有什么区别?

line-height:2是相对本身文字高度的2倍,line-height:200%是相对父元素文字高度的2倍。

5.inline-block有什么特性?如何去除缝隙?高度不一样的inline-block元素如何顶端对齐?

即呈现inline特性(不占据一整行,宽度由内容宽度决定)又呈现block特性(可设置宽高,内外边距);
去除缝隙(有空白字符产生缝隙):
1.把空白字符的字体设置为0;
2.把行内元素挤在一起可以去掉空白。
设置vertical-align:top可以顶端对齐

6.CSS sprite 是什么?

css sprite是将不同图片或图标合并在一张图上,然后利用css的background属性定位背景图位置。
优点:可以减少网络请求,提高网页加载性能;
缺点:维护的时候比较麻烦,需要改动的时候整张图都得改。

7.让一个元素"看不见"有几种方式?有什么区别?

opacity:0;设置透明度为0,占据位置;
display:none;不占据位置;
visiblity:hidden;和opacity:0类似;
background-color:rgba(0,0,0,0)设置背景色透明;

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,687评论 1 92
  • text-align: center的作用是什么,作用在什么元素上?能让什么元素水平居中 1、当作用于块级元素时,...
    我要认真学前端阅读 3,856评论 0 1
  • 1.text-align: center的作用是什么,作用在什么元素上?能让什么元素水平居中? text-alig...
    草鞋弟阅读 2,312评论 0 0
  • 一,text-align: center的作用是什么,作用在什么元素上?能让什么元素水平居中 作用在块级元素上面,...
    DeeJay_Y阅读 1,794评论 0 0
  • 1. text-align: center的作用是什么,作用在什么元素上?能让什么元素水平居中 text-alig...
    billa_8f6b阅读 3,161评论 0 0