前端面试CSS问题

HTML5与CSS31.如何使一个盒子处垂直水平居中?

        1.利用定位   2.利用margin:auto  3.利用 display:table-cell   4.利用display:flex设置垂直水平都居中  5.计算父盒子与子盒子的空间距离    6.利用transform  

2.Localstorage sessionStorage cookie 的区别?

        1.cookie 数据始终在同源http请求中携带(即使不需要)   Localstorage,sessionStorage不会自动把数据发送给服务器,仅在本地保存

        2.储存大小限制也不同 cookie 数据不能超过4k,

        3.数据的有效期是不同的 sessionStorage 仅在当前浏览器窗口关闭之前有效  Localstorage始终有效 窗口或浏览器关闭也一直保存

        4.作用域不用 sessionStorage不在不同的浏览器窗口中共享 及时是同一个页面 Localstorage在所有同源窗口中的都是共享的  cookie 也是共享的

3.对语义化的了解 并列举几个 有语义化的标签?

        例如:header 头部区域    section 标签定义了文档中的节点   artction标签定义文档中的节(区段) artice 标签定义独立的内容   aside 标签定义页面主体区域内容之外的内容 footer元素描述了文档底部区域

        1.去掉样式丢失的时候能让页面呈现清晰的节后 

        2.屏幕阅读器,会玩玩去哪根据你的标记类读你的页面

        3.有利益SEO 和搜索引擎建立良好的沟通 有利于爬虫抓取有效的信息

        5. 便于团队开发与维护

4.CSS中link月@import的区别?

        适用范围不同: @import 可以在网页页面中使用 也可以在css中使用 用来将多个css文件引入到一个css文件中 而link值能将css文件引入到网页页面中

        功能范围不同 link属于XHTML标签 而@import是ccs提供的一种方式

        加载顺序不同 当一个页面被加载的时候 link引用的css会同时被加载

5.为什么会出现浮动 浮动的元素会引起什么问题 如何清除浮动?

        1.浮动定位将元素排除在普通流之外 及时元素脱离的了文档流 不占据空间  浮动元素碰到包含他的边框或者浮动元素的边框停留

        2.为什么需要清除 父元素的高度无法被撑开 影响与福元素怒同级的元素怒  与浮动元素怒同级的非浮动元素(内联元素)会跟随其后  若非第一个元素浮动 则该元素之前的元素也需要浮动

        3.清除浮动的方式 使用隔墙法  给父级元素太设置双伪元素  给父级元素设置 overflow:hidden 或者 overflow:auto 本质是构建一个BFC

6.important的作用?

        !important作用是提高指定样式规则的优先权

7.什么情况会出现margin塌陷问题 如何解决margin塌陷问题?

         第一中情况:链各个统计元素 垂直排列 上面的盒子给margin -bottom 下面的盒子给margin-top那么他们两个的间距会充电 以大的那个计算

        第二种情况: 两个父子局元素 内部的盒子给 margin-top 其他的父级也会受到影响同时产生上边距 父子元素会进行粘连 

解决方案:    为父盒子设置border 为外层添加border后父盒子就不是真正意义上的贴合了 可以设置边框透明  父级添加一个css属性 overflow:hidden禁止超出    为父盒子添加一个padding值  

8.雪碧图(精灵图)?

        是把网站上用到的一些图片整合到一张单独的图片中 从而减少你的网站htttp请求的数量 还可以减少图片体积  解决了设计师在图片命名的困扰 只需要一张合计的图片上命名就可以了  更换风格方便  

        在维护时候麻烦    不能随意更改大小和颜色

9.img中alt与title的异同?

        alt是加载失败时候  显示在网页上的替代文字 title是鼠标放在上面显示的文字 对图片的进一步说明

10.Position的值有哪些 分别有什么作用?

        static默认值 不脱离文档流 top right bottom left等属性不失效 

        absolute 绝对定位  的关键就是找对参照物  

        relative 相对定位 元素偏移前的位置

        fixed 固定定位 参照物浏览器窗口的位置  它会脱离文档流 

11.什么是外边距重叠 重叠后会有什么后果

        外边距重叠指的是 当链各个垂直外边距想遇时 等他们会形成一个外边距  合并后的外边距  合并后的外边距的高度等于两个发生合并的外边距的高度中的高度如果都是正边界 边界宽度是相邻边界宽度中最大的值