###前提・実現したいこと
度々質問させていただいてすみません!今回は、コメントが投稿されると、表示されるスレッドを吹き出しにして、その背景色を投稿に合わせてランダムに色を変えて表示する という処理をしたいと考えています。ランダムに選んだ色は投稿時に、mySQLに色番号をinsertして、SQL文で出力されたものを使用しようと思っているのですが、まずはその前の表示テストで、スレッドの背景の変更は出来ているのですが、吹き出しのはじの三角部分の色のところの処理の仕方がわかりません。
吹き出しのやり方はネット上で公開されているものを使わせていただきました。
###該当のソースコード
CSS
1.bubble { 2 display:inline-block; 3 position: relative; 4 padding:1em; 5 border-radius:15px; 6} 7.bubble:after { 8 position: absolute; 9 content: " "; 10 height: 0; 11 width: 0; 12} 13/* 左三角半分 */ 14.bubble-half-left:after { 15 right: 100%; 16 top: 10%; 17 border-top:10px solid ; 18 border-left:10px solid transparent; 19} 20//-------------------------------------------------------------- 21表示部分 22<?php 23$var = array(); 24$var = array('#e4d2d8','#d3cfd9','#e8d3c7','#e0ebaf'); 25$result = $var[mt_rand(0, count($var)-1)]; 26?> 27<div class="bubble bubble-half-left" style="background:<?php echo $result?>"> 28あいうえおかきくけこ</div>
###試したこと
CSSの、bubble-half-left:afterの中身をbubble:afterの中に一緒に入れてみたりしましたが、三角部分は真っ黒になります。
うまく中央部分と色を連動させることって出来ますでしょうか?
よろしくお願いいたします。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/05/04 07:58
退会済みユーザー
2016/05/04 08:07
退会済みユーザー
2016/05/04 08:14
2016/05/05 03:12
退会済みユーザー
2016/05/05 06:03