Q&A
コンパイル後のCSSをご提示ください
あと、今どうなってますか？「できない」では分かりません。
吹き出しを作るCSSとかそれなりに出てるので探して出ないことはないかと思いますが。
■やりたいこと
写真みたいに左上に吹き出しがあるチャット風ボックスを作りたい。
■行動したこと
左下ならできたが左上ができない。
html
1<div>aaaaa</div> 2
css
1div { 2 position: relative; 3 font-family: Arial; 4 font-size: 20px; 5 line-height: 120px; 6 text-align: center; 7 width: 250px; 8 height: 120px; 9 border-radius: 10px; 10 padding: 0px; 11 border: #000 solid 4px; 12} 13 14div::before { 15 content: ""; 16 position: absolute; 17 width: 0; 18 z-index: 0; 19 border-style: solid; 20 border-width: 0 44px 24px 0; 21 border-color: transparent #000 transparent transparent; 22 top: 25%; 23 left: -48px; 24 margin-top: -14px; 25 display: block; 26} 27 28div::after { 29 content: ""; 30 position: absolute; 31 display: block; 32 width: 0; 33 z-index: 1; 34 border-style: solid; 35 border-width: 0 40px 20px 0; 36 border-color: transparent #000000 transparent transparent; 37 top: 25%; 38 left: -40px; 39 margin-top: -10px; 40}
scssは消してcssにしました。
今、吹き出し部分を枠線のみにしたいのですが、どうしても背景が黒くなってしまい解決策を模索しています。
それなりに調べましたが斜めの上の枠線のみの吹き出しの作成の仕方は見つからなかったです。
回答1件
0
ベストアンサー
投稿2021/02/09 07:10
総合スコア36946
回答ありがとうございます。
吹き出しのところの背景色を消して枠線のみにしたいのですが、解決策わかりますでしょうか？
構造上、それは難しいのではないでしょうか？
かしこまりました！
背景は白にして実装してみます。
ご丁寧にありがとうございました！
あなたの回答
tips
プレビュー
