blockquote使用方法
blogger編輯器中 在工具列右邊數來第三個有個「"」的Quote的功能可以用
預設的樣子就像是縮排的功能
被Quote(引用)的文字會向右縮排 離上行文字也會稍微離開一點
是個獨立強調出某段文字的方法
Quote除了預設的縮排之外也有很多其他的花樣
這篇就稍微提一下我最近用的三個
1.
也就是只要在撰寫模式下點工具列的Quote就會變這樣
不用再進去html模式下改語法 因為常用弄成這樣比較方便
語法如下
在blogger管理介面下→主題→自訂→進階→新增CSS
這裡貼上這段code就可以用了
我之前是這樣用的 不過剛剛看的時候我加好的code不見了
因此要從另一個地方去看 主題→編輯HTML
然後ctrl+f搜尋blockquote 裡面改成這樣的話預設的blockquote就會是這樣了
2.
語法如下
用法是進html把blockquote的class從預設的tr_bq改成frame
如果不滿意框的寬度的話可在class=""後面再加上style="width: 500px;"這段語法
數字不滿意可以再調
樣式不滿意的話border: 後三項分別是框的寬度、樣式、顏色
樣式可以改成solid實線、dashed一條一條的線或不加
padding則是文字離框分別是上右下左的距離
3.
語法如下
overflow是搭配max-height用的 設定了在超過max-height的時候會有滾輪
以固定最大高度
background除了顏色 後面網址和語法是設定左邊那條黑黑的圖
至於這個網址我是用我自己的空間 可是感覺不太穩定 用網路上的可能比較好
border padding同上
line-height搭配字型大小可以決定行高
預設的樣子就像是縮排的功能
被Quote(引用)的文字會向右縮排 離上行文字也會稍微離開一點
是個獨立強調出某段文字的方法
Quote除了預設的縮排之外也有很多其他的花樣
這篇就稍微提一下我最近用的三個
1.
這是一段示範文字這個是我預設的blockquote
這是一段示範文字這是一段示範文字
這是一段示範文字這是一段示範文字這是一段示範文字
也就是只要在撰寫模式下點工具列的Quote就會變這樣
不用再進去html模式下改語法 因為常用弄成這樣比較方便
語法如下
blockquote {至於要加在哪
margin-left: 6px;
padding-left: 15px;
border-left: 13px solid #c87;
}
在blogger管理介面下→主題→自訂→進階→新增CSS
這裡貼上這段code就可以用了
我之前是這樣用的 不過剛剛看的時候我加好的code不見了
因此要從另一個地方去看 主題→編輯HTML
然後ctrl+f搜尋blockquote 裡面改成這樣的話預設的blockquote就會是這樣了
2.
這是一段示範文字這是之前按鈕式文字我拿來包住全部連結的外框
這是一段示範文字這是一段示範文字
這是一段示範文字這是一段示範文字這是一段示範文字
語法如下
blockquote.frame {加入的地方跟之前一樣在html模式下在開頭加<head><style> 加入好code後再補上</style></head>
border: 3px dotted #7F9A39;
padding: 10px 17px 20px 20px;
}
用法是進html把blockquote的class從預設的tr_bq改成frame
如果不滿意框的寬度的話可在class=""後面再加上style="width: 500px;"這段語法
數字不滿意可以再調
樣式不滿意的話border: 後三項分別是框的寬度、樣式、顏色
樣式可以改成solid實線、dashed一條一條的線或不加
padding則是文字離框分別是上右下左的距離
3.
這是一段示範文字最後是如果要加入code程式碼質感的文字的話可以用這個
這是一段示範文字這是一段示範文字
這是一段示範文字這是一段示範文字這是一段示範文字
語法如下
blockquote.codeblock {font-family是字型 font-size是字大小
font-family: Courier New;
font-size: 10pt;
overflow:auto;
background: #f0f0f0 url(https://lh6.googleusercontent.com/2nlDOFykjh0XYPmRyACYkEqQaEqBQ-0uSPjK3hyfyFI2VUuIvWnfwNbCaCp_Rkgtjy358yE=w70) left top repeat-y;
border: 1px solid #ccc;
padding: 10px 10px 10px 21px;
max-height:1000px;
line-height: 1.5em;
}
overflow是搭配max-height用的 設定了在超過max-height的時候會有滾輪
以固定最大高度
background除了顏色 後面網址和語法是設定左邊那條黑黑的圖
至於這個網址我是用我自己的空間 可是感覺不太穩定 用網路上的可能比較好
border padding同上
line-height搭配字型大小可以決定行高
留言
張貼留言