我有這個工作的CSS,但我喜歡把它合併成一行,可能嗎?我怎樣才能使這個CSS邊界屬性一班?
border-radius: 0;
border-color: #ccc;
border-width: 0 0 2px 0;
border-style: none none solid none;
我有這個工作的CSS,但我喜歡把它合併成一行,可能嗎?我怎樣才能使這個CSS邊界屬性一班?
border-radius: 0;
border-color: #ccc;
border-width: 0 0 2px 0;
border-style: none none solid none;
這篇簡短的文章涵蓋了您在日常工作中遇到的各種CSS速記。
https://www.w3.org/community/webed/wiki/CSS_shorthand_reference
邊境
border
允許您設置border
width
,style
和color
。
UPDATE:
由於@torazaburo指出它實際上需要border: 0 none #ccc
它是正確的,還有加入border-radius: 0
因爲它不是略寫的邊框的一部分。
#example {
border: 0 none #ccc;
border-bottom: 2px solid #ccc;
border-radius: 0;
}
如果它不是一個問題,以下可能採取從級聯其他規則非底邊框的寬度和風格,那麼這應該是罰款:
#example {
border-bottom: 2px solid #ccc;
}
產生相同的CSS你」重新想:
太好了,謝謝! –
@torazaburo不夠公平。我已經更新了我的答案。 – fuzz
如果只是嘗試做
border-bottom: 2px solid #ccc;
它可能會採取級聯中其他規則的非底部邊框寬度和樣式。如果這不是問題,那麼以上就沒問題。
,對於與你什麼建議的唯一可靠方法涉及到三線,有沒有辦法解決它:
#example {
border: 0 none #ccc;
border-bottom: 2px solid #ccc;
border-radius: 0;
}
不幸的是,有必要重複#ccc
在border-bottom
屬性,因爲如果省略它不要從級聯的價值;相反,它需要currentColor
。有必要指定border-radius
作爲單獨的屬性,因爲它不是border
速記的一部分。
border:2px solid #ccc;這將使它在單行,但2px寬度將添加頂部底部和兩側。,如果你想只有底部的寬度,你必須使用它單獨聲明爲border-width-bottom:2px; – theinarasu