不透明度 (opacity)一、opacity 概述opacity 属性指定了一个元素的不透明度。属性值属性值描述0元素完全透明(即元素不可见)0.0 - 1.0元素半透明(元素后面的背景可见),值越大,元素透明度越低1元素完全不透明(即元素后面的背景不可见)二、基本用法案例演示<style> .item { width: 100px; height: 100...
2026年02月23日
不透明度 (opacity)一、opacity 概述opacity 属性指定了一个元素的不透明度。属性值属性值描述0元素完全透明(即元素不可见)0.0 - 1.0元素半透明(元素后面的背景可见),值越大,元素透明度越低1元素完全不透明(即元素后面的背景不可见)二、基本用法案例演示<style> .item { width: 100px; height: 100...
2026年02月23日
文本溢出显示省略号单行文本和多行文本溢出隐藏并显示省略号 ... 在实际项目开发中经常使用。一、单行文本溢出显示省略号必要属性/* 文字不换行 */ white-space: nowrap; /* 超出显示省略号 */ text-overflow: ellipsis; /* 超出部分隐藏 */ overflow: hidden;案例演示<style> p { widt...
2026年02月23日
文本阴影 (text-shadow)一、text-shadow 概述text-shadow 用来为文字添加阴影效果,如果要给文字添加多个阴影,多个阴影之间用 ,(逗号)隔开。当阴影个数 > 1 时,阴影应用的顺序为从前到后,第一个指定的阴影在最顶部显示。基本语法/* x偏移和 Y偏移,值可以为正负整数 模糊半径 为 0 或大于 0 的整数 */ text-shadow: x偏移...
2026年02月23日
盒子阴影 (box-shadow)一、box-shadow 概述box-shadow 给盒子添加阴影效果,阴影是不占空间的。基本语法box-shadow: [inset] x偏移 Y偏移 [模糊半径] [扩散半径] 颜色;参数说明参数说明inset表示内阴影,当需要设置内阴影时,才添加(可省略)x偏移阴影在 x 轴(水平)方向偏移量值为正,表示阴影向右偏移值为负,表示阴影向左偏移y偏移阴影在...
2026年02月23日
圆角边框 (border-radius)一、border-radius 概述border-radius 用来设置元素的(4个方向)外边框 1/4 圆角效果。圆角类型圆角类型描述举例圆角边框当使用一个半径时,确定一个圆border-radius: 50px;椭圆边框当使用两个半径时,确定一个椭圆border-radius: 50px / 30px;注: 圆角效果就是这个椭圆或圆与边框的交集形成...
2026年02月23日