PTT數位生活區 / Blog (部落格)

[痞客] 痞客邦圖片與文字間距的語法

看板Blog (部落格)作者 (嵐嵐)時間10年前 (2014/05/19 15:48), 編輯推噓0(0推 0噓 21→)
留言21則, 2人參與, 最新討論串1/1
因為找了好久都看不到語法， 我是想知道關於後台CSS修改的語法， 就是我文章內的圖片跟圖片之間都沒有空白， 完全就是黏在一起，想知道該怎麼調整他? 找了好久只看到文字與文字間的間距修改， 卻找不到文字與圖片或是圖片跟圖片的間距修改>< 附圖，想要右邊那種感覺。 http://ppt.cc/tftB 還有就是下圖紅色部分的間距該怎麼調小呢? http://ppt.cc/ivud 謝謝大家!! -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 111.252.181.232 ※ 文章網址: http://www.ptt.cc/bbs/Blog/M.1400485711.A.8C1.html
→
05/20 09:15, , 1F
1)圖片間距 於css增加下面這句
05/20 09:15, 1F
→
05/20 09:15, , 2F
.article-content-inner img { padding: 10px 0; }
05/20 09:15, 2F
→
05/20 09:16, , 3F
2)首先找到.title {……}修改其中margin的值
05/20 09:16, 3F
→
05/20 09:17, , 4F
margin: 10px 0 30px; 改成margin: 10px 0 0;
05/20 09:17, 4F
→
05/20 09:18, , 5F
接下來找到.bookmark {……} 同樣修改其中padding值
05/20 09:18, 5F
→
05/20 09:19, , 6F
padding: 20px 0 0; 整句刪掉或將20px 改小即可
05/20 09:19, 6F
→
05/20 09:19, , 7F
-------------------------------------------------
05/20 09:19, 7F
→
05/20 09:20, , 8F
padding或margin 數值寫法
05/20 09:20, 8F
→
05/20 09:23, , 9F
A B; 兩個數值時，A表示上下間距，而B表示左右間距
05/20 09:23, 9F
→
05/20 09:25, , 10F
A B C;三個數值 A為上間距，B左右間距，C為下間距
05/20 09:25, 10F
→
05/20 09:26, , 11F
A B C D; 四個時，依序表示 上、右、下、左
05/20 09:26, 11F
→
05/20 09:27, , 12F
如果只有一個值，表示上下左右同時都間隔某值哦
05/20 09:27, 12F
→
05/20 21:31, , 13F
天啊太感謝了><但是改過以後我部落格裡面的圖示都會往上飄
05/20 21:31, 13F
→
05/20 21:33, , 14F
http://ppt.cc/k~cx 像這樣><看起來怪怪的><
05/20 21:33, 14F
→
05/20 22:22, , 15F
那你可以將1)padding數值改成 20px 0 0; 只留上間距
05/20 22:22, 15F
→
05/20 22:24, , 16F
這樣就不會飄了~~上下間距大小你可以試試怎樣最佳哦
05/20 22:24, 16F
→
05/20 22:35, , 17F
--------別理上兩行------換下面方法^_<
05/20 22:35, 17F
→
05/20 22:35, , 18F
將1)的.article-content-inner img 改成下面這個
05/20 22:35, 18F
→
05/20 22:36, , 19F
.article-content-inner img[src$=".jpg"]
05/20 22:36, 19F
→
05/20 22:37, , 20F
這樣就不會影響你的小圖了哦 ^_^
05/20 22:37, 20F
→
05/20 23:02, , 21F
太感謝了><真是幫了我大忙!!!!
05/20 23:02, 21F
‣ 更多 ert230 的文章
文章代碼(AID): #1JURTFZ1 (Blog)
Blog 近期熱門文章
更多 近期熱門文章 >>
PTT數位生活區 即時熱門文章
更多 即時熱門文章 >>
‣ 更多 ert230 的文章
文章代碼(AID): #1JURTFZ1 (Blog)