1
如何使用CSS樣式邊框這樣CSS - 樣式邊框標題
這裏是我當前的css
header .fixed-header .left h2 {
font-size: 14px;
display: inline-block;
border-bottom: 1px solid #000;
}
,但只是做一個邊框在底部標題,我如何樣式像上面的圖像的邊框權利
如何使用CSS樣式邊框這樣CSS - 樣式邊框標題
這裏是我當前的css
header .fixed-header .left h2 {
font-size: 14px;
display: inline-block;
border-bottom: 1px solid #000;
}
,但只是做一個邊框在底部標題,我如何樣式像上面的圖像的邊框權利
用僞元素和transform: skew()
h2 {
display: inline-block;
position: relative;
padding: 0 2em;
}
h2:before {
content: '';
position: absolute;
top: 0; left: 0; right: 0; bottom: 0;
border: solid black;
border-width: 0 1px 1px 0;
transform: skew(-45deg);
transform-origin: bottom;
}
<h2>asdf</h2>
非常感謝你! – vinnlee
@vinnlee你打賭:) –
有你看着':before'和':after'僞元素呢? – haxxxton