07 2022 档案
摘要：一、less基础 @变量名:值 二、less嵌套 #header { .logo { width: 300px; } } 三、less运算 less提供了+ - * / 四则运算 运算中间符号左右有空格
阅读全文
摘要：一、动态设置html标签 font-size大小 3.元素大小取值 1. 页面元素的rem值 = 页面元素值（px）/ （屏幕宽度 / 划分的份数） 2.屏幕宽度/划分的份数 就是html font-size的大小 3.或者rem = 页面元素值（px）/ html font-size字体大小
阅读全文
摘要：一、rem基础 rem单位 rem（root em）是个相对单位，em就是父元素大小
阅读全文
摘要：一、flex 弹性布局 设置为flex布局，子元素的float，clear和vertical-align 属性将失效 伸缩布局 = 弹性布局 = 伸缩盒布局 = flex布局 二、flex常用排列方式 flex-direction 主轴方向 属性：row 从左到右 | row-reverse 从右到
阅读全文
摘要：一、移动适配 移动端调试： 二、视口 (viewport) 2.1 布局视口 layout viewport 早期使用，一般设置为980px 2.2视觉视口 visual viewport 用户正在看到的网站的区域 2.3理想视口 ideal viewport 需要手动添加meta视口标签，为了使布
阅读全文
摘要：一、logoSEO优化 二、box一行放不下浮动元素 描述：一个box盒子。里面放了12个ul li项浮动元素，因为box宽度不足，无法实现一行放4个 问题： 解决： 解决方法：设定 ul 的宽度为4个 li 的宽度 ，从而使一行放置了4个li项，溢出部分可以隐藏，方法是在box盒子样式设置 ove
阅读全文
摘要：一、新增语义化标签 二、新增多媒体标签 三、新增input类型 四、新增的表单属性 一、CSS3新增属性选择器 二、CSS3 结构伪类选择器 结构伪类选择器主要根据文档结构来选择器元素，常用于根据父级选择器里面的子元素 nth-child(n)与nth-of-type(n)的区别：nth-child
阅读全文
摘要：一、精灵图 原理：把许多张小图片拼成大图片 作用：为了减少服务器接收和发送请求的次数，提高页面的加载速度 实现：backgroud-position 二、字体图标 iconfont 字体图标 特点：展示的是图标，实际上是文字 字体图标下载：icomoon 字体库:http://icomoon.io/
阅读全文
摘要：一、CSS优先级 ！important > 行内样式style="" > ID选择器 > 类选择器/伪类选择器 > 元素选择器 > 继承或者＊ 权重叠加：复合选择器由权重叠加的问题，虽然可以叠加但是永远不会有进位 二、盒子 ｂｏｘ border: border-width || border-sty
阅读全文
摘要：CSS主要由两部分组成，选择器以及一条和多条声明 h1 { color: red; font-size: 25px;} ↑ ↑ ↑ 选择器 属性: 值 （声明） 一、选择器 就是选择标签用的，分为两类：基础选择器和复合选择器 基础选择器由单个选择器组成，包括：标签选择器（直接使用HTML标签名称）、
阅读全文
摘要：标签 一、属性写在标签名后面 二、属性不分先后顺序，标签和属性，属性和属性之间用空格间隔开 三、属性采取键值对的形式，即 key = "value" ,属性 = "属性值" 超链接 可以将图片或者文字作为超链接 锚点链接 点击链接跳转到页面中的某个位置 表格 用来展示数据的 <table> <tr>
阅读全文
