![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
always_yang
这个作者很懒,什么都没留下…
展开
-
html布局的常用的四种实现方式
需求:假设高度默认100px ,请写出三栏布局,其中左栏、右栏各为300px,中间自适应第一种实现方式:浮动布局将左右的div宽度设为300px,分别左右浮动,中间盒子不设宽度。注意:先写右边盒子,再写中间盒子,否则先渲染中间盒子,中间盒子会占满该行剩下的宽度,右边盒子只能换行显示,就会出现下面的情况正常的渲染效果如下所示:<style type="text/css">html,body{padding:0;margin:0;}.container{padding:原创 2020-06-06 08:34:55 · 1850 阅读 · 0 评论 -
css居中方式实现
1.水平居中1.1 text-align:center父盒子设置text-align:center,如果子盒子不是行内元素,可以先设置display:inline或者display:inline-block转成行内元素。.father{ text-align:center;}.chlidren{ display:inline-block; background: red;}<div class="father"> <div class="chlidren原创 2020-06-06 08:32:09 · 147 阅读 · 0 评论 -
用css画一个三角形
[2019/5/20 14:49]border-top: 10px solid transparent;border-bottom: 10px solid transparent;border-right: 10px solid #000;原创 2019-05-20 14:57:25 · 157 阅读 · 0 评论 -
flex属性
CSS属性 flex 规定了弹性元素如何伸长或缩短以适应flex容器中的可用空间。这是一个简写属性,用来设置 flex-grow, flex-shrink 与 flex-basis。1、flex-grow 属性用于设置或检索弹性盒子的扩展比率。(注意:如果元素不是弹性盒对象的元素,则 flex-grow 属性不起作用。)2、flex-shrink 属性指定了 flex 元素的收缩规则。fle...原创 2019-05-20 17:12:35 · 252 阅读 · 0 评论