-
1:ID:eHkA2Y · 2日前

#css cssで、矩形の四隅にだけボーダーを付けたいと思っています。
下記URLのような仕様ですが、無駄なdivを書かず、擬似要素や他の方法でスマートに書くにはどうすればいいでしょうか?
http://tacosvilledge.hatenablog.com/entry/2018/11/14/202327

6 件の回答

2:ID:L27el6 · 2日前

画像使うのOKならsvgかなにかで「という画像を作って、
beforeをblock要素にしたやつに背景を2枚設定(上左と上右。それぞれleft:0、right:0とする)、
afterにも同じように背景に2枚設定するというのはどうだろう。
borderでやりきるのは無理っぽい気がする。

4:ID:C3s/bP · 2日前

空タグ入れたくないなら背景画像かね。
親タグに::beforeで絶対配置、
left-1px top-1px 縦横calc(100% + 2px)とか。
background-positionで四隅に画像配置とか。

5:ID:ohE.wE · 2日前

border-image でゴニョゴニョする。

6:ID:zXpcKd · 2日前

ボーダーのあれだ、グラデを作る。。

7:ID:/3FTPS · 1日前

要素がサイズ固定なら10*10のbeforeに黒のbox-shadowを4つ重ねて位置をずらして、afterで灰色重ねるとか?

1 件の回答が除外されました。[詳細]

あと文字
ご利用の際は、利用規約をご一読ください。

一緒に読まれている質問

ページ上部に戻る