摘要：<section class="layout grid"> <article class="left-center-right"> <div class="left">我是 left</div> <div class="center"> <h1>网格布局解决方案</h1>我是 center </di 阅读全文

摘要：background-image: -webkit-linear-gradient(left, #2af598, #009efd); //开始方向，渐变颜色 -webkit-background-clip: text; //以盒子内的文字作为裁剪区域向外裁剪，文字之外的区域都将被裁剪掉。 -webk 阅读全文

摘要：https://www.w3school.com.cn/svg/svg_rect.asp 阅读全文

摘要：###transform 定义旋转的 语法： .mydiv{ transform: rotate3d(30deg, 45deg, 100deg); } 值 描述 none 定义不进行转换。 translate(x,y) 定义 2D 平移。(10px, 10px)就是把元素右移10px，再下移10px 阅读全文

摘要：##transition 语法： transition: property duration timing-function delay; //要设置过渡的css，这个要过渡多长时间完成，过渡的速度（均匀/变速..），动画延迟 property 最方便就是all，否则就写css要变的属性，多属性的话 阅读全文

摘要：####只能放在第一行 或者 @charset 之后 @import "navigation.css"; /* 使用字符串 */ 或者 @import url("navigation.css"); /* 使用 url 地址 */ 在根据设备不同，写多套代码的时候可能有用 阅读全文

摘要：###语法 vertical-align: baseline|sub...; 他这个基线比较迷惑，要是有谁会的话推荐一下，谢谢（22-03-17） 值 描述 baseline 默认。元素放置在父元素的基线上。 sub 垂直对齐文本的下标。 super 垂直对齐文本的上标 top 把元素的顶端与行中最 阅读全文

摘要：###前提 把display: flex的div容器叫做flexBox，被浮动的叫做flexItem ###样式————宽度——flex 属性是 flex-grow、flex-shrink 和 flex-basis 属性的简写 语法：felx: grow|shrink|basis ; //任选一个而 阅读全文

摘要：###综述 list-style 简写属性在一个声明中设置所有的列表属性。 可以设置的属性： list-style-type, list-style-position, list-style-image. 可以不设置其中的某个值，比如 "list-style:circle inside;" 也是允许 阅读全文

摘要：font 简写属性在一个声明中设置所有字体属性。 可设置的属性是（按顺序）： "font-style font-variant font-weight font-size/line-height font-family" （样式 变种 粗 大小/行高 字体） font-size和font-famil 阅读全文

摘要：上节说道background-image能做的background都能做 ###综述 值 说明 url('URL') 图像的URL none 无图像背景会显示。这是默认 linear-gradient() 创建一个线性渐变的 "图像"，(默认从上到下) radial-gradient() 用径向渐变 阅读全文

摘要：摘抄于：https://www.cnblogs.com/nostic/articles/5269066.html background 简写属性在一个声明中设置所有的背景属性。 可以设置如下属性： background-color background-position background-rep 阅读全文

摘要：###基操 /* 滚动条整体部分，可以设置宽度等 */ body::-webkit-scrollbar{ } /* 滚动条两端的按钮 */ body::-webkit-scrollbar-button{ } /* 外层轨道 */ body::-webkit-scrollbar-track{ } /* 阅读全文

摘要：####最朴素（两条边 + 模糊）：x偏移 y偏移 模糊半径 颜色是默认黑色 box-shadow: 10px 10px 10px; ####朴素（两条边 + 扩展 + 模糊 + 颜色 + 分内外）：接收六个值（X轴偏移量 Y轴偏移量 阴影模糊半径 阴影扩展半径 阴影颜色 投影方式） 名字 作用 X 阅读全文

摘要：##权重：内联 > id > class > 元素（属性） ##属性 //全选 [attributeName] { } //带attributeName属性的div节点 div[attributeName] { } input[type="email"]{ } //div的子元素中，带attribu 阅读全文

摘要：https://codepen.io/in-6026/pen/ExbOqVP 最多接受8个值 对应的角的顺序是：左上，右上，右下，左下 当接收8个值时，每个角又被分为条边 border-radius: 1 2 3 4 / 5 6 7 8; 分别对应下图： 阅读全文

摘要：https://www.runoob.com/cssref/css-websafe-fonts.html 阅读全文

摘要：px 最常用，相对屏幕的分辨率而言的相对单位 % 一般相对父元素而言 em，rem em相对父元素的font-size rem相对根元素（html）的font-size vw，vh vw相对屏幕可视区域的宽度而言，若屏幕宽1000px则1vw=1000 / 100 = 10px vh相对屏幕可视区域 阅读全文

摘要：方式1 <div class="box"> <img src="#" /> </div> .box{ width: 2000px; height: 200px; overflow: hidden; border: 1px solid; } .box img { //以宽为标准，填充div，超出的高度 阅读全文

摘要：多行转省略 width: 100%; max-height: 60px; font-size: 13px; line-height: 20px; /*关键之处，缺一不可*/ display: -webkit-box; -webkit-line-clamp: 3; /*要在第几行处隐藏，单行超出便省略 阅读全文