CSS基礎4——使用CSS格式化元素內容的文本

來源:互聯網
上載者:User

標籤:樣式   滾動   sim   不能被繼承   white   方式   陰影   ext   rom   

CSS的文字屬性用於控制文本的段落格式,如設定首行縮排。段落對齊、字間距、行間距等。

1、設定文本首行縮排:text-indent

可選屬性值包含: 長度 / 百分比

2、設定文本對齊:text-align

可選屬性包含:left / right / center,分別表示相靠左對齊。向靠右對齊,置中對齊

3、設定文本修飾方式:text-decoration

可選屬性包含:none / underline (底線)  / overline(上劃線) / line-through(刪除線) / blink(閃爍) 

4、設定文本陰影製作效果:text-shadow
可選屬性值包含: none  /  color
5、設定行高:line-height
屬性值能夠是數字,長度,百分比或者normal
6、設定字間距:letter-spacing
可選屬性值包含: none / auto  / 自己定義長度
7、設定詞間距:word-spacing
可選屬性值包含: none / 自己定義長度
8、設定文本大寫和小寫屬性:text-transform
可選屬性包含:capitalize 把每一個單詞的首字母變成大寫
     uppercase 把元素中的全部的字母變成大寫
     lowercase  把元素中的全部字母變成小寫
9、設定空白顯示形式:white-space
要輸入空格的方式:一個是"&nbsp;"。還有一個是<pre>標記。

而CSS中white-space屬性類似於pre
可選屬性值包含:normal / pre / nowrap
10、設定元素內容的字型顏色與背景
(1)設定元素的前景色彩:color  
取值:能夠是16進位值、rgb()函數或者CSS承認的顏色名(如white)
(2)設定背景色:background-color,取值同前景色彩
(3)設定背景圖片:background-image
取值是:圖片的URL地址
(4)設定背景映像的鋪排:background-repeat
取值:repeat  /  no-repeat  /  repeat-x  /  repeat-y
(5)設定背景映像是歲對象內容滾動還是固定的:background-attachme
取值:sroll  /  fixed
(6)設定背景圖片顯示的位置:background-position
取值:百分比。自己定義長度(如100px,100px)   /  top  /  center  /  bottom  / left  /  right
11、設定列表格式:list-style-type
屬性取值:disc 預設值。實心黑點
circle 空心圓圈
square 方形黑塊
decimal  十進位數
lower-roman 小寫羅馬數字
upper-roman 大寫羅馬數字
lower-alpha 小寫字母
upper-alpha 大寫字母
none  無
也能夠用list-style-image把列表前面的符號換成圖形,若同一時候指定了list-style-type和list-style-image屬性,則僅僅有當瀏覽器不能顯示圖片作為項目符號時,list-style-type才生效。


12、樣式繼承:被用來節省為文檔書中的每一層級元素指定的CSS樣式規則,如給<body>設定一個字型顏色,則這個顏色會被網頁內全部的元素繼承,除非其它元素有他們自己指定的樣式。
不能被繼承的屬性:margin 、 padding 、 border 、 background

CSS基礎4——使用CSS格式化元素內容的文本

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.