本文共 1826 字，大约阅读时间需要 6 分钟。
opacity属性用于设置元素的透明度，值域为0-1。0表示完全透明，1表示不透明。该属性同时影响元素内的文字和背景。例如，设置opacity:0.5时，元素会呈现半透明效果。
rgba颜色模式包括红、绿、蓝和Alpha通道，用逗号分隔。Alpha值为0-1，用于设置元素的可透明层。例如，rgba(255,255,255,0.2)设置半透明白色背景。
background-clip属性用于控制背景填充的位置，默认为padding-box，意思是背景仅填充padding盒。例如，设置background-clip: padding-box;可确保背景仅出现在盒子内部。
cursor属性可设置鼠标指针的样式，默认为auto。如需定制，可使用图片文件扩展名为.cur或.ico的路径。例如，设置cursor: url('custom-curursor.cur'), auto;可定义一个定制指针。
display:none属性会完全移除元素，且不生成任何盒子，这可能会影响其他元素的布局。用于在页面中隐藏不需要的内容。
visibility: hidden属性会生成盒子，但只是隐藏盒子，使其在视觉上不可见。与display属性不同，隐藏后的元素仍然占据页面空间。
img元素用于在网页中嵌入图片，如广告或图片内容。如果图片是页面内容的一部分，应使用img标签。
当图片用于美化页面时，如顶部或底部背景，应使用background图片属性，而非img标签。例如，在页脚设置background-image: url('bg-image.jpg');可以实现美化。
background-image: url('路径')用于设置背景图片路径。默认重复方式为no-repeat，且图片会根据背景-size调整位置。例如，background-image: url('bg.jpg');默认表现为重复no-repeat，并根据其它属性调整大小和位置。
background-repeat:no-repeat设置背景图片不重复显示。可分别设置水平和垂直重复方向。例如，设置background-repeat: repeat-x;仅在水平方向重复，垂直方向不重复。
background-size属性用于设置背景图片的显示大小，默认值为cover或contain。cover表示图片完全覆盖容器，可能导致截图；contain表示图片按比例缩放以适应容器。还可指定像background-size: 100% 100%;或特定像素值如 background-size: 400px 200px。
background-position用于设置背景图片的位置，可使用left、right、top、bottom、center等关键字，或使用数值或百分比表示相对位置。例如，background-position: center;表示居中，background-position: 10px 10px;表示从盒子左下角偏移10px。
background-attachment: fixed属性可将背景图固定在视口中，不随滚动而变化。例如，background-attachment: fixed;可以用作固定的背景设计。
将背景图与页面背景颜色混合使用，可增强视觉效果。例如，在页脚设置semises背景图，并结合深色背景，可以使相应区域颜色越深越显眼。
background属性的同时设置可以联合使用。例如，background: url('bg.jpg') no-repeat 100% 100% fixed #000；该语法可简洁地实现多种背景效果。如需进一步定位，position属性可加入。
转载地址：http://mshcz.baihongyu.com/