随笔分类 -  HTML/CSS

js 防抖和节流，封装成函数
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document< 阅读全文
posted @ 2020-06-20 00:25 她的开呀 阅读(130) 评论(0) 推荐(0)
css 制作三角形
摘要：一. css制作三角符号的步骤 1. 写一个盒子，宽高必须为0 2. 根据自己所要三角形的方向，一个边界设置颜色，显示三角效果 3. 其它3边界设置相同颜色（一般设置白色），就显得设置不同颜色的那一边是个三角 div{ /*宽高必须为0*/ width: 0; height: 0; /*一个边界设置 阅读全文
posted @ 2020-06-07 00:00 她的开呀 阅读(281) 评论(0) 推荐(0)
css 定位
摘要：1. 相对定位 2. 绝对定位 3. 子绝父相 4. 固定定位 5. 定位叠放次序 6. 定位拓展 浮动不会压住下面标准流的文字（但是定位会） 7. 定位拓展 盒子居中 阅读全文
posted @ 2020-06-06 22:04 她的开呀 阅读(126) 评论(0) 推荐(0)
css中子元素浮动导致高度坍塌问题的解决
摘要：在父元素添加一个伪元素即可 .clearfix::after { content: ""; display: block; clear: both; } 阅读全文
posted @ 2020-06-06 21:52 她的开呀 阅读(247) 评论(0) 推荐(0)
css的垂直居中与水平居中
摘要：css的垂直居中与水平居中 一、 块级盒子水平居中 width 必须有宽度 盒子的左右外边距 auto width: 100px; height: 100px; margin: 0 auto; 二、 行盒/行块盒/文字水平居中 只需要在父级元素使用 text-align: center; 即可 三、 阅读全文
posted @ 2020-06-06 21:42 她的开呀 阅读(192) 评论(0) 推荐(0)
css属性值的层叠冲突规则
摘要：css属性值的层叠冲突规则 层叠冲突：同一个样式，多次用到同一个元素，就会发生层叠冲突，需要对样式表有冲突的申明使用层叠规则，确定css属性值 步骤1. 比较重要性，若css属性后面加有 !important ，就表示该属性值的优先级最高，就会使用该值作为当前属性的值（一般不用） color: #0 阅读全文
posted @ 2020-06-06 19:02 她的开呀 阅读(506) 评论(0) 推荐(0)
HTML中使用锚点链接快速定位到页面的某一位置
摘要：锚点链接：当点击链接时，可以快速地定位到页面中的某个位置 1. 为需要被定位的元素添加id属性，例如：<p id="p1">我是p1</p> 2. 使用<a>标签定位元素，设置href属性值为 ：#需要被定位元素的id,例如：<a href="#p1">p1</a> 代码示例： <a href="# 阅读全文
posted @ 2020-06-06 00:17 她的开呀 阅读(4313) 评论(0) 推荐(0)
Emmet语法快速生成HTML结构
摘要：代码示例: 在编辑器中输入 div.one#two$*3>p{我是$}*2+a{a标签} ，按Tab键，会生成如下htmL <div class="one" id="two1"> <p>我是1</p> <p>我是2</p> <a href="">a标签</a></div> <div class="o 阅读全文
posted @ 2020-06-05 23:56 她的开呀 阅读(253) 评论(0) 推荐(0)
css多余文本使用....代替
摘要：1. 只显示单行文本，多余文本使用...代替 1 white-space: nowrap; 2 overflow: hidden; 3 text-overflow: ellipsis; 2. 显示多行文本，多余文本使用...代替 1 display: -webkit-box; 2 overflow: 阅读全文
posted @ 2019-12-17 09:39 她的开呀 阅读(1073) 评论(0) 推荐(0)