CSS可以使用opacity屬性來控制元素的透明度,但是該屬性會影響元素和其內(nèi)部內(nèi)容的全部可見性,包括背景、邊框和文本等。如果只想讓背景或邊框透明,可以使用以下方法:
/* 只設(shè)置背景透明 */ background-color: rgba(255, 255, 255, 0.5); /* 最后一位為透明度,范圍為0-1 */ background-color: hsla(0, 0%, 100%, 0.5); /* 同上,使用hsla顏色值 */ /* 只設(shè)置邊框透明 */ border-color: rgba(255, 255, 255, 0.5); /* 僅對邊框生效 */ box-shadow: 0 0 5px rgba(255, 255, 255, 0.5); /* 也可以使用box-shadow來模擬透明邊框效果 */
值得注意的是,使用opacity屬性設(shè)置透明度會影響元素內(nèi)部內(nèi)容和后代元素的可見性,而使用rgba或hsla顏色值僅僅影響元素本身的可見性,不會影響其內(nèi)部內(nèi)容。因此,如果只想控制元素本身的透明度,推薦使用rgba或hsla顏色值。