CSSTXT – 為你的文字製作產生CSS樣式!

CSSTXT - 為你的文字製作產生CSS樣式!

CSSTXT是一個線上的CSS樣式產生工具,使用者不懂CSS沒關係,透過這個工具就可以輕鬆在線上產生特殊樣式的文字。使用方式很簡單,只要將文字輸入在 hello enter a text… 框框內,就能夠開始動手幫文字加上樣式。

對於沒有編輯器或是不懂CSS語法的使用者來說,變更文字樣式只要透過CSSTXT工具,就會變得再簡單不過了!

CSSTXT - 為你的文字製作產生CSS樣式!

最上面一排是文字的樣式設定,如果需要文字有什麼樣的樣式就點選即可。

  • 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/

分享本文
Pseric

Pseric

學生時代成立網站以來堅持每日更新,在挖掘資料的過程中慢慢找出自己經營網站的方法,最開心的是有一群一起長大的讀者。

文章: 6497