枠線にグラデーションをつけよう!
枠線にグラデーションをつけてみようか
要素を入れ子にすることで、枠線に濃淡をつけるんだよ
塗りつぶしを使う、ということですか?
その通り、前面と背面で色分けするんだ
なるほど~
それでは、今日のコードだよ
<div style=" padding: 1px;width:300px;border-radius:25px; background: linear-gradient(to right, #00f, #f00);"><div style=" padding: 16px; background-color: #fff;text-align:center;border-radius:25px;">ボックスのグラデーション</div></div>
できました!
入れ子にした要素のbackground-colorで、ボーダーっぽく表現できてるね