跳到主要內容

[CSS] 段落設定屬性


CSS段落屬性能幫助網頁排版、段落、字距、對齊等,排出漂亮的版型!



letter-spacing

功能 - 設定文字間隙 ( 可設單位屬性 : 點pt、英寸in、公分cm、像素px ),此性質可設定字距,也就是字與字的間隔,只需指定一個長度單位給它或用normal特徵字設為預設值。
語法 -  letter-spacing: NORMAL︱( length )
範例 -  letter-spacing:10pt

line-height
功能 - 設定文字行列高度 ( 可設單位屬性 : 點pt、英寸in、公分cm、像素px、百分比% ),此性質可設定列高,可指定特徵字normal設為預設值,或指定含單位的長度值,或百分比(參照於父元件)均可。
語法 - line-height: NORMAL︱( number )︱( length )︱( percentage ) 
範例 - line-height:10pt}

text-align功能 - 設定調整文字 ( 可設左邊、右邊、置中、整齊 ),這個性質可決定文句在區塊內的水平對齊方式,可用值有left、right、center、justify。
語法 - text-align: left︱right︱center︱justify 
範例 - text-align: center

text-decoration
功能 - 設定文字裝飾 ( 分為 : 無、加底線、加橫線、加頂線 )。設定此區塊內的字句要不要加裝飾線,可用值有none(不加)、underline(加底線)、overline(加頂線)、line-through(加刪除線)、blink(大致同none)。
語法 - text-decoration: none | underline︱line-through︱overline 
範例 - text-decoration: underline

text-indent功能 - 設定文字縮排 ( 可設單位屬性 : 點pt、英寸in、公分cm、像素px、百分比% )。這個性質可設定段落的首行縮排(就像作文時一樣,首行要縮排),可指定含單位的長度值,或是百分比值(參照於父元件)。
語法 - text-indent : ( length )︱( percentage ) 
範例 - text-indent : 1cm

text-transform
功能 - 設定文字改變 ( 可設無、第一個字母大寫、大寫、小寫 )。設定英文字母大小寫顯示法。可用值有none(不自動轉換)、capitalize(第一個字母自動轉為大寫)、uppercase(全部自動轉換為大寫)、lowercase(全部自動轉換為小寫)。
語法 -  text-transform : none︱capitalize︱uppercase︱lowercase
範例 -  text-transform : capitalize

text-autospace
這是用來調整字距的性質,用來設定是否於特定位置加大空白間距,以增加美觀。可用特徵字有none(不使用)、ideograph-alpha(於遠東語系與拼音語系間加大空白)、ideograph-numeric(於遠東語系與數字間加大空白)、ideograph-parenthesis(於遠東語系與括號間加大空白)、ideograph-space(遠東語系之兩旁加大空白)。一般很少有人用這個性值,通常是text-autospace:none。

text-justify設定段落中各句如何調整,使段落左右之邊界對齊。可用值有inter-word(利用調整字距)、newspaper(利用調整字距或字母間距)、distribute(與newspaper很像,但最適用於東亞)、distribute-all-lines(連最後一行也調整至同寬,一般不會用這個值)、inter-ideograph(利用增加或減少字距來調整)、auto(由瀏覽器語系決定)。這個性質要IE5.0以上才能使用,一般都用text-justify:auto。

word-break設定一行結束時的斷字法,可用值有normal(允許斷字)、break-all(允許斷字,適用於大量中文夾雜少量英文)、keep-all(只允許於英文斷字,適用於大量英文夾雜少量中文)。一般用word-break:break-all較適於中文字。

留言

這個網誌中的熱門文章

[新竹] 系統傢俱各家比較與心得(三商美福、安德康、木可、歐德、綠的)

最近花蠻多時間在比較系統傢俱,與趕著預售屋客變有關,不過也因此了解不少。以往都覺得系統傢俱較死板、無造型、設計。但這次的經驗,讓我對系統傢俱有較不一樣的感覺。 其實,系統傢俱是個蠻能「客製化」的設計,只要自己有做足功課,我認為每家系統傢俱都可以達到客戶喜好的風格、效果,而它們相較於木工親民的價格真的會讓人感動落淚。 我自己的感覺是,大家(如:綠的、三商美福)的系統傢俱在聘請設計師上,較有經驗也較有獨特見解,而且空間規劃較熟練,比較抓得到客戶的喜好與需求,當然價格較高。 小家(如:木可、安德康等)的系統傢俱最大好處在於價格親民,但設計師如果也願意用心,做出來的作品一定不輸大的。前提是,客戶自己必須明白自己要的是甚麼?喜好?需求?風格.......等。

[生活] 幸福新居落成

這次預售屋拖了很久,所以我們匆匆安排裝修,同時也還有一些地方需要修繕,整個忙翻天了!但仍然很滿意這個新家,不管是格局還是大小,打算至少再住個十年! 時程上原先預定於 102年12月可以交屋,拖到103年3月底才勉強交到一個差強人意仍須修繕的屋。匆匆簽了切結,就安排木工入場。木工張先生也是很配合,4月11日就幫我們正式入場,該保護的都做好保護就開始施工。

[生活] 新居落成之三房兩廳極簡無印風裝潢~安德康系統櫃 vs B&Q特力屋輕裝潢

偶然下,又有裝潢新居的機會,這次希望節省預算,含冷氣、基本生活電器、希望節省在50萬內,又不想失去新居裝潢的品味,再次要自己來擔任統包跟設計師的苦命監工。 如果有人有興趣看五年前的分享文,任意門如下: 👇 [生活] 幸福新居落成 [新竹] 系統傢俱各家比較與心得(三商美福、安德康、木可、歐德、綠的) 新居位於高樓,景觀採光還真不錯,搭配無印風應該也會美美的,加上之前有於IKEA購置的傢俱(衣櫃、電視櫃、書桌、餐桌、小孩翻轉床、16格櫃),傢俱都偏向淺木色。 系統櫃還是找 竹北安德康 這次製作的項目有,玄關櫃、鞋櫃、電視櫃與清水模電視牆、餐桌旁電器櫃,價格約13萬8000元。設計師是江樂軒小姐,哈哈哈~但人很親切好溝通,可以給一個具體的想法請他設計,但是要記得提醒他隔天有約,很忙容易忘記?!XD B&Q的施工項目有,冷氣水排遷移後修補、天花燈具安裝(不含燈具、LED燈是在PCHOME買的)、弱電箱包覆牆改刷黑板漆、走廊天花裝飾、客廳單邊間接照明、三房一廳冷氣盒、客廳窗簾盒。本建案建商有附天花平釘,所以就省錢沒重新做,不過有些地方做的是有些粗糙...總共93000元。 字好多,先來看看施工過程~ 會找B&Q做木工的契機是,在B&Q的活動購買了四台冷暖氣,一共11萬7000元,送的折價券多花4000元就可以買一台林內的熱水器,蠻划算。後來冷氣因為要改水排位置,加上最後冷氣管線包覆額外多出了33000元工錢,這邊就不確定到底整體下來是不是有比電器行便宜?! B&Q師傅基本地板保護後,便開始拉冷氣管 冷氣管線最早拉,後來才開始改水排。 主臥水牌加冷氣盒 客廳間接照明、水排位移、走廊裝飾柱 客廳窗簾盒 因為想說讓同家廠商完成,配合度應該相對比較高? 加上木工報價全室做起來含水排修復、建照等油漆93000元,覺得還算經濟實惠。 弱電箱包覆,裡面就是弱電鐵門不好看,做了一個十公分厚的包覆,表層設計成黑板 完成冷氣安裝與油漆,淺間照效果也還是不錯的 B&Q特力屋整個工程的時程大約才10天左右,算是蠻有效率。 師傅上,我覺得品質不差,不過監工可能要勤快一點,免得與預期有落差,油漆品質倒是稍嫌隨性,黑板漆漆的不是很均勻。 系統櫃裸裝