css實現的首字母下沉程式碼例項

antzone發表於2017-04-02

本章節通過程式碼例項介紹一下如何利用css實現首字母下沉效果。

程式碼例項如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>
<html> 
<head> 
<meta name="author" content="http://www.softwhy.com/" /> 
<meta charset="gb2312">
<title>螞蟻部落</title>
<style type="text/css">
div:first-letter{ 
  font-size:20px; 
  font-weight:bolder; 
  float:left;
}
</style>
</head>
<body>
<div>螞蟻部落歡迎您,只有努力奮鬥才會有美好的未來</div>
</body>
</html>

:first-letter選擇器可以參閱CSS E::first-letter偽物件選擇器一章節。

相關文章