随笔分类 - CSS
摘要:css实现精致的角标 参考:视觉还原小技巧!CSS 实现角标效果 纯色角标 -> 有白色到透明渐变的角标 -> 更精致有微弱高光的角标 .ribbon1 { margin: 0 60px; font-size: 34px; line-height: 70px; color: #fff; text-a
阅读全文
摘要:css渐变 linear-gradient、repeating-linear-gradient 参考:详解 linear-gradient 和 radial-gradient 的使用 定义 CSS linear-gradient() 函数用于创建一个表示两种或多种颜色线性渐变的图片。 linear-
阅读全文
摘要:CSS filter滤镜属性、clip-path裁减属性 filter contrast(amount) 调整输入的对比度 amount<number>或amount <percentage> 小于100%会降低对比度,大于100%增加对比度。值0%将创建一个完全灰色的图像,而值将100%保持输入不
阅读全文
摘要:使用 text-overflow: ellipsis .text { overflow: hidden; /* 将超出的部分隐藏掉 */ text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box
阅读全文
摘要:实现思路 1.设置input 属性hidden对该input进行隐藏,或者通过display:none也可以 <input type="radio" name="type" id="adviceRadio1" value="1" checked hidden/> 2.借助label for标签通过i
阅读全文
摘要:Flex 布局示例 容器的属性 1、flex-direction属性 flex-direction属性决定主轴的方向(即项目的排列方向)。 .box { flex-direction: row | row-reverse | column | column-reverse; } 2、flex-wra
阅读全文
摘要:box-shadow: h-shadow v-shadow blur spread color inset; 值描述 h-shadow 必需。水平阴影的位置。允许负值。 v-shadow 必需。垂直阴影的位置。允许负值。 blur 可选。模糊距离。 spread 可选。阴影的尺寸。 color 可选
阅读全文
摘要:background: background-color background-image background-repeat background-position / background-size div { background: #00FF00 url(bgimage.gif) no-re
阅读全文
摘要:rgba(0,0,0,0.2) #00000033 十六进制颜色透明度alpha值对照表 100% — FF99% — FC98% — FA97% — F796% — F595% — F294% — F093% — ED92% — EB91% — E890% — E689% — E388% — E0
阅读全文