iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 2
0
自我挑戰組

CSS、JS-30天研究筆記系列 第 3

【day3】關於CSS content屬性

  • 分享至 

  • xImage
  •  

一、 content 與替換元素:
content 屬性生成的物件稱為“匿名替換元素”(anonymous replaced element)。
content 生成的文本具有以下特性:

  1. content 生成的文本是無法選中、無法複製的
  2. 無法被螢幕閱讀設備讀取,也無法被搜尋引擎抓取。所以不可以把重要的文字資訊用content 屬性生成
  3. 一般用於生成裝飾性圖形
  4. 時常使用在::before 和 ::after 這二個偽元素中

二、 content 實際應用:
1.用於輔助元素生成:
把 content 的屬性值設置為空字串,例如:.box:before { content: ''; }
然後搭配其他CSS屬性生成輔助元素。目的是使HTML代碼更精簡。
2.輔助元素佈局:
最常見的用法是用於清除浮動,例如:
.clear:after { content: ''; display: block; clear: both; }


上一篇
【day2】關於CSS height高度屬性
下一篇
【day4】關於CSS padding屬性
系列文
CSS、JS-30天研究筆記31
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言