前端面试题(css相关)

display:none和visibility:hidden的区别?

display:none 隐藏对应的元素,在文档布局中不再给它分配空间,它各边的元素会合拢,
就当他从来不存在。

visibility:hidden 隐藏对应的元素,但是在文档布局中仍保留原来的空间。

CSS中 link 和@import 的区别是?

(1) link属于HTML标签,而@import是CSS提供的;

(2) 页面被加载的时,link会同时被加载,而@import引用的CSS会等到页面被加载完再加载;

(3) import只在IE5以上才能识别,而link是HTML标签,无兼容问题;

(4) link方式的样式的权重 高于@import的权重.

position的absolute与fixed共同点与不同点?

共同点:
1.改变行内元素的呈现方式,display被置为block;2.让元素脱离普通流,不占据空间;3.默认会覆盖到非定位元素上

不同点:
absolute的”根元素“是可以设置的,而fixed的”根元素“固定为浏览器窗口。当你滚动网页,fixed元素与浏览器窗口之间的距离是不变的。

CSS的盒子模型?

IE 盒子模型、标准 W3C 盒子模型;

IE的content部分包含了 border 和 pading; 盒模型包括内容(content)、填充(padding)、边界(margin)、 边框(border).

CSS 选择符有哪些?

  1. id选择器( # myid)
    2.类选择器( .myclassname) 
    3.标签选择器( div, h1, p)
    4.相邻选择器( h1 + p)
     5.子选择器( ul > li)
    6.后代选择器( li a)
    7.通配符选择器( * )
    8.属性选择器( a[rel = "external"])
    9.伪类选择器(a: hover, li:nth-child)
     

猜你喜欢

转载自www.cnblogs.com/yyc1998/p/11880153.html