摘要: 1.上下margin重叠问题 HTML: <div class="box1"></div> <div class="box2"></div> CSS: * { margin: 0; padding: 0; } .box1 { height: 100px; width: 100px; backgrou 阅读全文
posted @ 2022-04-15 14:34 请善待容嬷嬷 阅读(36) 评论(0) 推荐(0) 编辑
摘要: 1.影响 让子元素默认横向排列 (默认主轴:水平方向;相反侧轴:垂直方向) 弹性盒子会把行内元素,变成块元素 只有一个元素时,使用margin:auto 自动居中 2.修改主轴方向 属性:flex-direction 属性值: row (默认:水平排列) row-reverse 水平取反排列 col 阅读全文
posted @ 2022-04-15 10:51 请善待容嬷嬷 阅读(305) 评论(0) 推荐(0) 编辑
摘要: 1.单行文本溢出显示省略号 HTML: <div> Visual Studio Code(简称 VS Code)是一个由微软开发,同时支持 Windows 、 Linux 和 macOS 等操作系统且开放源代码的代码 编辑器,编辑器中内置了扩展程序管理的功能。 </div> CSS: div{ he 阅读全文
posted @ 2022-04-15 09:39 请善待容嬷嬷 阅读(409) 评论(0) 推荐(0) 编辑
摘要: 以阿里矢量图标库为例: 1.添加图标 1.登录网站 2.找到自己需要的图标,点击加入购物车 3.点击左上角购物车图标,讲刚刚选中的图标添加到项目,选中要加入的项目,点击确定 2.使用方式(下载后使用) 1.在项目设置里面,勾选这几个选项,保存 2.将该项目的图标下载到本地,会得到一个压缩包 3.下载 阅读全文
posted @ 2022-04-15 08:46 请善待容嬷嬷 阅读(339) 评论(0) 推荐(0) 编辑
摘要: 1.怪异盒模型 语法:box-sizing:border-box; padding和border被包含在定义的width和height之内。对象的实际宽度就等于设置的width值,即使定义有border和padding也不会改变对象的实际宽度。 HTML : <div> 怪异盒模型 </div> C 阅读全文
posted @ 2022-04-15 08:40 请善待容嬷嬷 阅读(48) 评论(0) 推荐(0) 编辑
摘要: CSS伪类 1.链接伪类 :link 未访问链接 :visited 已访问链接 :hover 鼠标划过链接 :active 已选中的链接 2.结构伪类 first-child 选择父元素的第一个子元素。 last-child 选择父元素的最后一个子元素。 nth-child(n) n取值:数字,ev 阅读全文
posted @ 2022-04-14 23:39 请善待容嬷嬷 阅读(24) 评论(0) 推荐(0) 编辑
摘要: 字体模块(@font-face) 语法: font-family:你的字体名称 src:url(你的字体文件路径) font-weight:你的字体粗细 font-style:你的字体样式 HTML Code: <div>天道酬勤</div> CSS Code: @font-face { font- 阅读全文
posted @ 2022-04-14 23:37 请善待容嬷嬷 阅读(45) 评论(0) 推荐(0) 编辑
摘要: 文本阴影(text-shadow) 属性: 水平阴影位置 垂直阴影位置 阴影模糊距离 阴影颜色 ; HTML Code: <div class="box1"> 文本阴影 </div> CSS Code: .box1{ width: 100px; height: 100px; line-height: 阅读全文
posted @ 2022-04-14 23:35 请善待容嬷嬷 阅读(24) 评论(0) 推荐(0) 编辑
摘要: radio单选框,默认样式小圆圈,默认不会互斥,想要互斥有需要给一组单选框添加相同的name属性 <div>1.你对京东首页满意度如何</div> <div> <input type="radio" name="aaa" id="">非常满意 </div> <div> <input type="ra 阅读全文
posted @ 2022-04-14 23:33 请善待容嬷嬷 阅读(18) 评论(0) 推荐(0) 编辑
摘要: 父元素不写高度时,子元素写了浮动之后,父元素会发生高度塌陷 示例代码: HTML代码: <div class="box"> <div class="box-l">left浮动</div> <div class="box-r">right浮动</div> </div> CSS代码: .box{ wid 阅读全文
posted @ 2022-04-14 23:24 请善待容嬷嬷 阅读(68) 评论(0) 推荐(0) 编辑