![](https://img-blog.csdnimg.cn/20201014180756923.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS总结
yuan_jiazhen
我相信只要我坚持,总有一天会不一样。
展开
-
CSS常用居中方式
HTML结构注:该HTML为React写法,也可使用原生HTML代替。 <div className={styles.parent}> <div className={styles.children}>子盒子</div></div>(1)绝对定位盒子居中.parent { position: relative;...原创 2019-08-05 23:46:08 · 171 阅读 · 1 评论 -
清除浮动
HTML结构<div class="parent"> 父盒子 <div class="floatLeft">浮动左边盒子</div> <div class="floatRight">浮动左边盒子</div></div>CSS代码注:此CSS单纯为了展示居中的效果,不涉及居中的代码,读者可...原创 2019-08-08 23:27:50 · 101 阅读 · 1 评论 -
DIV+CSS布局之左边宽度固定,右边宽度自适应
HTML结构 <div class="parent"> <div class="leftBox">左边宽度固定盒子</div> <div class="rightBox">右边宽度自适应盒子</div> </div>相关CSS代码注:以下CSS为Less写法,读者可转换成原生CSS,...原创 2019-08-06 19:34:35 · 681 阅读 · 1 评论 -
纯CSS实现一个气泡框
实现原理:主要通过CSS的border-color属性,结合::before、::after和position: absolute实现。(1)画一个正方形或长方形的盒子,别忘记此盒子需加上position: relative,不然之后的绝对定位元素会相对于其余设了position: relative的父级元素或windom定位,绝对定位元素就会跑偏了。<div class="div...原创 2019-08-20 08:07:42 · 2680 阅读 · 0 评论