![](https://img-blog.csdnimg.cn/20210728175128856.jpeg?x-oss-process=image/resize,m_fixed,h_224,w_224)
CSS布局技巧
文章平均质量分 57
主要讲解CSS布局的方方面面
大前端工程师
2022年本科毕业,热爱前端,喜欢二次元。喜欢软萌妹~
展开
-
CSS技巧系列--使用视频作为背景
有一些官方网站为了弘扬他们的企业文化,往往会拍一些记录短片。如果能把这些记录短片放在公司的官方网站上,既能体现公司的企业文化又能给网站提供更加绚丽的视觉享受原创 2022-01-22 23:34:47 · 22318 阅读 · 13 评论 -
实现自适应两列布局
自适应布局一共两列,左面的那一列弹性的,右面的那一列宽度是固定的200px。不允许使用flex布局代码实现css#main,#sideBar{ float: left; color: #fff;}#main{ width: 100%; margin-right: -200px; background-color: #10375E;}#sideBar{ width: 200px; background-color: #00B5EE;}html<div id="mai原创 2021-07-21 08:45:52 · 199 阅读 · 0 评论 -
CSS设置元素高度占浏览器窗口宽度的100%
问题重述height:100%这个用法只有在父容器有高度的情况下才可以使用过的,可是我们的body它的高度是自适应它里面元素高度的。换句话说,通常body的高度并不是浏览器窗口高度的,所以你对下面的元素设置height:100%,并不能充满屏幕高度那我们怎么解决呢,其实很简单。请看代码:/*清除默认边距*/*{ margin: 0; padding: 0;}/*设置html标签高度为100%,body高度为100%*/html,body{ height: 100%;}html原创 2021-07-15 18:55:30 · 6657 阅读 · 0 评论