![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS常见面试题
文章平均质量分 58
The_upside_of_down
这个作者很懒,什么都没留下…
展开
-
如何实现自适应布局
如何创建自适应布局百分比布局使用媒体查询(CSS3@media查询)rem响应式布局vw响应式布局flex弹性布局响应式网页设计是一种新的网站设计模式,从此构建的网站可自动适应不同的的访问设备,方便用户阅读和导航浏览,减少用户的放大/缩放/滑动的操作,提升良好的用户体验。百分比布局可以通过对属性的设置百分比来适配不同的屏幕,但是需要注意的是百分比是相对于父元素的。使用媒体查询(CSS3@media查询)利用媒体查询设置不同分辨率下的CSS样式,来适配不同的屏幕。body { backgro原创 2021-04-28 00:20:38 · 522 阅读 · 0 评论 -
CSS常见面试题
常见面试题CSS实现宽度100%,高度为宽度一半的的盒子CSS实现宽度100%,高度为宽度一半的的盒子通过vw视口单位实现所谓视口单位是相对于视口(viewport)的尺寸而言,100vw等于视口宽度的100%,即1vw等于视口宽度的1%。这个方法有个优点就是,无论图片是否加载成功,容器高度始终是计算完成的,不会造成页面的抖动,也不会造成页面重绘,从而提升性能。 .box { width: 100%; height: 50vw; } .box img { wid原创 2021-04-19 22:19:13 · 112 阅读 · 0 评论