broken image
broken image
broken image
  • 主頁
  • 文章分類 
    • 所有博客分類
    • 噗浪
  • 商品 
    • 所有商品分類
    • 噗版訂製
    • 噗版下載
    • 桌布下載
  • 商店
  • 部落格
  • …  
    • 主頁
    • 文章分類 
      • 所有博客分類
      • 噗浪
    • 商品 
      • 所有商品分類
      • 噗版訂製
      • 噗版下載
      • 桌布下載
    • 商店
    • 部落格
  • 0
broken image
broken image
broken image
  • 主頁
  • 文章分類 
    • 所有博客分類
    • 噗浪
  • 商品 
    • 所有商品分類
    • 噗版訂製
    • 噗版下載
    • 桌布下載
  • 商店
  • 部落格
  • …  
    • 主頁
    • 文章分類 
      • 所有博客分類
      • 噗浪
    • 商品 
      • 所有商品分類
      • 噗版訂製
      • 噗版下載
      • 桌布下載
    • 商店
    • 部落格
  • 0
broken image

更改噗浪字型

調整浪上的噗文字呈顯方式

· 噗浪

噗浪語法的基本結構除了「畫面背景」、「時間軸」及「主控台」外,最主要的呈現噗文內容的區塊,就是時間軸上的每則訊息,我們稱作「浪上的噗」。

閱讀和使用上的需要,如果覺得噗浪預設的字體太小或是間距太擠,甚至字型不美麗,都可以使用自訂語法的欄位來試著調整它。

噗浪原先預設的樣子:

broken image

這裡包括展開後的訊息列表,可以發現列表的文字比浪上的噗文還小一級。

使用自訂語法調整字體、字型、文字行距間距和連結樣式後,可以得到不同的呈現:

broken image

這個示例所填入的語法內容如下:

/*浪上的噗*/

.plurk_cnt .text_holder

{

font-family: "Lucida Grande", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "Helvetica", "MS Pゴシック" !important; /*字型*/

font-size: 1.1em !important; /*字體大小*/

font-weight: 400 !important; /*字體粗細*/

letter-spacing: 0.08em !important; /*字元間距*/

line-height: 2em !important; /*行距*/

color: #555 !important; /*字體顏色*/

}

/*連結樣式*/

.plurk a.ex_link, .text_holder a.ex_link,

.plurk a.ex_link:visited, .plurk a.ex_link:active,

.plurk_content a.ex_link

{

color: #007ADE !important;

text-decoration: none !important; /*底線*/

background: none !important; /*底色*/

}

.plurk a.ex_link:hover, .text_holder a.ex_link:hover,

.plurk_content a.ex_link:hover

{

color: #004985 !important;

text-decoration: none !important;

}

在CSS語法中若要加上註記,可以將文字放入 /* */ 這種斜線和星號組成的敘述框中,就不會干擾瀏覽器判讀語法,也能方便自己之後要修改語法對照用。

{ } 裡面就是使用的CSS編寫語句,前面則是該區塊的項目名稱,可以試著更改各個項目之數值和字型選擇,看看會呈現出什麼樣不同的效果,找到最合適自己使用型態的方式。

訂閱
上一篇
噗浪基本語法
下一篇
如何套用噗浪版型
 返回網站
Cookie的使用
我們使用cookie來改善瀏覽體驗、保證安全性和資料收集。一旦點擊接受,就表示你接受這些用於廣告和分析的cookie。你可以隨時更改你的cookie設定。 了解更多
全部接受
設定
全部拒絕
Cookie 設定
必要的Cookies
這些cookies支援安全性、網路管理和可訪問性等核心功能。這些cookies無法關閉。
分析性Cookies
這些cookies幫助我們更了解訪客與我們網站的互動情況,並幫助我們發現錯誤。
偏好的Cookies
這些cookies允許網站記住你的選擇,以提升功能性與個人化。
儲存