[CSS]pseudo-element – 佛祖球球

實際上來說，CSS 中的偽元素在HTML上是不存在的，使用的時機通常都是針對某樣元素特殊處理時才會用到

常用的 pseudo-element：

• ::first-line

  可以指定 p 元素第一行的樣式

• ::first-letter

  可以指定 p 元素第一個字的樣式

• ::selection

  定義使用者反白後的效果

• ::before

  在元素之前插入內容

• ::after

  在元素之後插入內容

範例 HTML

    臣亮言，先帝創業未半

    每天，天剛亮時，我母親便把我喊醒，叫我披衣坐起。我從不知道她醒來坐了多久了。

first-line and first-letter

/* 第一行樣式 */
p::first-line {
    color: red;
}
/* 開頭第一個字樣式 */
p::first-letter {
    font-size: 30px;
}

selection

// 反白後的效果
p::selection {
    background: red;
    color: #FFF;
}

// Firefox
p::-moz-selection {
    background: red;
    color: #FFF;
}

分類

• Android
• AngularJS
• API Blueprint
• Chrome
• Database
  • MySQL
• DataStructure
• Docker
• Editor
  • Vim
• Firefox
• Git
• GitLab
• Google API
• Hadoop
• Language
  • Go
  • Java
  • JavaScript
    • jQuery
      • jQueryChart
    • Node.js
    • Vue
  • PHP
    • Laravel
    • ZendFramework
  • Python
• Mac
• Network
  • Cisco
  • DLink
  • Juniper
• Oauth
• Server
  • Apache
• Share
• Unix
  • FreeBSD
  • Linux
• WebDesign
  • Bootstrap
  • CSS
  • HTML
  • Wordpress

Search