CSSで半開いた線を描く方法は？

-2

右半分開かれた線分画像：CSSでこの線を描画する方法CSSで半開いた線を描く方法は？

？応答性のある水平線部分。私はHow can I make a pointy arrow with a div in CSSとhttps://css-tricks.com/examples/ShapesOfCSSを見つけましたが、私はこれらを連結する能力がありません。

出典

2016-09-25 Dmitrij Podabed

を使用して1つの要素と1擬似要素:beforeでこれを作成することができますhttp://jsfiddle.net/fqcFp/499/ – Tommy

感謝あなたは大変です。 –

あなたは私が矢印フィドルを更新Flexbox

.line { 
 
    width: 150px; 
 
    height: 2px; 
 
    background: black; 
 
    margin: 50px; 
 
    display: flex; 
 
    align-items: center; 
 
} 
 
.line:before { 
 
    content: ''; 
 
    width: 10px; 
 
    height: 10px; 
 
    background: black; 
 
    border-radius: 50%; 
 
}

<div class="line"></div>

出典

2016-09-25 08:57:08

申し訳ありませんが、これを逆にする方法はありますか？ .line :: afterでの.lineは機能しません。 –

フィドルを作り、あなたが意味することを私に見せてください。 –

https://jsfiddle.net/524o575r https://yt3.ggpht.com/-3TxDIZx2XJY/VivZFKRVMeI/AAAAAAAAAD4/CDopwio6gK8/w1060-fcrop64=1,00005a57ffffa5a8-nd-c0xffffffff-rj-k-no/Channelが必要です％2BArt％2Bテンプレート％2B％2528Photoshop％2529.jpg（HTML + CSS） –

CSSで半開いた線を描く方法は？

答えて

関連する問題