CSSTXT是一個線上的CSS樣式產生工具,使用者不懂CSS沒關係,透過這個工具就可以輕鬆在線上產生特殊樣式的文字。使用方式很簡單,只要將文字輸入在 hello enter a text… 框框內,就能夠開始動手幫文字加上樣式。
對於沒有編輯器或是不懂CSS語法的使用者來說,變更文字樣式只要透過CSSTXT工具,就會變得再簡單不過了!
最上面一排是文字的樣式設定,如果需要文字有什麼樣的樣式就點選即可。
- bold: 粗體
- underline: 下底線
- overline: 上劃線
- italic: 斜體
- oblique: 斜的
- line-throug: 刪除線
- UPPERCASE: 全大寫
- SMALLCAPS: 較小的全大寫
左邊是文字距離、行高、邊寬的設定,如下:
- Letter spacing: 字元間距
- Word spacing: 文字間距
- Font size: 文字大小(有三種單位)
- Line height: 行高
- Border size: 邊框尺寸
最右邊則有字型、對齊方式、邊框樣式和顏色的設定。
- Font family: 文字字型
- Text align: 對齊方向
- Border style: 邊框的樣式,須搭配 Border size 使用。
- Font color: 文字顏色
- Background color: 背景顏色
- Border color: 邊框顏色,同樣須搭配 Border 設定。
設定完成後,按下 Generate 就能產生使用者設定的文字樣式,可以預覽,不滿意隨時可以調整更動。
最後複製下方的原始碼(擇一)就能夠顯示該文字樣式囉,相當方便。若你使用的是部落格或討論區編輯器,請先確認支援HTML語法,並先行切換到原始碼模式在將原始碼貼上才能正確顯示。
【網站網址】https://csstxt.com/