CSS
方程式1002
这个作者很懒,什么都没留下…
展开
-
盒子模型 -- 标准盒子模型, 怪异盒子模型
1. css 盒子模型 一个盒子模型包括: 外边距(margin), 边框(border), 内边距(padding), 内容(width/height) 注: 以下width/height 皆是指css 中代码里面的宽高, 而盒子模型的宽高皆称作为 盒子的宽高 以上也就是我们所说的 标准盒子模型(也就是W3C盒子模型) 盒子的宽高= margin + border + padding + wi...原创 2020-04-22 09:45:57 · 146 阅读 · 0 评论 -
flex布局
-flex-direction:设置主轴的方向 row (默认值)从左到右 row-reverse 从右到左 column 从上到下 column-reverse 从下到上 - justify-content:设置主轴上的子元素排列方式 flex-start 从头部开始 flex-end 从尾部开始 center 居中显示 space-around 平分剩余空间 space-...原创 2019-04-08 21:22:52 · 346 阅读 · 0 评论 -
HTML+CSS3
HTML新增元素 header 头部标签 nav 导航栏 section 块 article 文章,内容 aside 侧边栏 footer 底部标签 (IE9 中需要将这些元素转换为块元素display:block;) 音频 和 视频 sourse资源 controls 设置或返回音频/视频是否显示控件(比如播放/暂停等)。 loop 设置或返回音频/视频是否应在结束时重新播放。 mu...原创 2019-04-08 21:21:01 · 302 阅读 · 0 评论 -
css-使用技巧
css-高级技巧 1. 元素的显示与隐藏 display 显示(重点) - display 设置或检索对象是否及如何显示。 display: none 隐藏对象 display:block 除了转换为块级元素之外,同时还有显示元素的意思。 - 特点: 隐藏之后,不再保留位置。 visibility 可见性 (了解) - 设置或检索是否显示对象。 visibility:visible ; 对象可...原创 2019-04-07 20:14:15 · 127 阅读 · 0 评论 -
六. CSS属性书写顺序(重点)
CSS属性书写顺序(重点) 1. 布局定位属性:display / position / float / clear / visibility / overflow(建议 display 第一个写,毕竟关系到模式) 2. 自身属性(跟盒子相关的):width / height / margin / padding / border / background 3. 字体文本属性:color / fo...原创 2019-04-07 20:10:25 · 440 阅读 · 0 评论 -
五、定位详解
边偏移(方位名词) 简单说, 我们定位的盒子,是通过边偏移来移动位置的。 定位模式 (position) 定位模式是有不同分类的,在不同情况下,我们用到不同的定位模式。 a. 静态定位(static) - 了解 b. 相对定位(relative) - 重要 相对定位的特点:(务必记住) - 相对于 自己原来在标准流中位置来移动的 - 原来在标准流的区域继续占有,后面的盒子仍然以标准流的方式...原创 2019-04-07 20:09:15 · 97 阅读 · 0 评论 -
四、浮动、清除浮动的方法(重点)
1、额外标签法(隔墙法) 在最后一个浮动的标签后面添加一个没有空的div . clear { clear:both; } 2、overflow 给父亲加的 overflow: hidden; 3、: after 伪元素 给父盒子加 .clearfix:after { content: ""; display: block; height...原创 2019-04-07 20:07:23 · 90 阅读 · 0 评论 -
三、box 盒子模型
三、 1、边框 border 颜色 border-color 粗细 border-width 样式 border-style solid 实线的 dashed 虚线 dotted 点状线 举例 border: 1px solid red ; 4个边框都是红色的实线 border-top: 1px dashed pink; top left right bottom border-top-col...原创 2019-04-07 19:39:41 · 200 阅读 · 0 评论 -
二、三大特性
继承性 子级不指定,有一些样式 会继承父亲的样式 字体属性 font- font-size font-style font-weight font-family 文本属性 text- font- line- 颜色等 text-align:left/center/right text-decoration: underline/none t...原创 2019-04-07 19:30:59 · 81 阅读 · 0 评论 -
一、样式属性
1、字体 font font-size 别忘了跟单位 px像素单位 font-style 跟斜体有关系 em i 属性值 font-style:normal; 正常,不倾斜 font-style: italic; 斜 font-weight 字体加粗 strong b 属性值 font-weight: 400; 不加粗 normal ...原创 2019-04-07 19:28:20 · 197 阅读 · 0 评论