css基础
foolBirdd
菜鸟实录
展开
-
css3 让一个圆5s内上下匀速反复移动200px
HTML<div id="ball"></div>CSS /* 圆球上下来回移动200px,5s内 */ #ball { /* 令元素脱离文档流,不然动不起来 */ position: absolute; width: 100px; height: 100px; background-color: red; border-radius: 50%; animation: move 5s原创 2022-04-07 17:07:55 · 486 阅读 · 0 评论 -
CSS Flex 布局常用属性总结
如果一个元素设置了display: flex;,则该元素为 flex 容器,其子元素为 flex 子元素容器属性flex-direction:决定主轴方向flex-direction: row | row-reveres | column | column-reverseflex-wrap:决定一条轴线如果排不下,如何换行flex-wrap: nowrap | wrap | wrap-reverseflex-flow:上述两个属性的缩写flex-flow: <flex.原创 2021-08-02 23:11:14 · 146 阅读 · 0 评论 -
你不知道的css盒模型
基本知识css 盒模型本质上是一个盒子,封装 html 元素,它包括外边距(margin)、边框(border)、内边距(padding)、内容(content)css盒模型有两种:标准模型+IE模型标准模型盒子总宽度(高度) = 内容宽度(content)+ 2*border + 2*padding设置 width/height 的话是改变content的大小设置box-sizing: content-box (默认设置)IE模型(怪异盒模型)盒子总宽度(高度)原创 2021-03-14 12:09:06 · 139 阅读 · 0 评论