0

三角形を div に追加して、ある種の吹き出しを作成しようとしています。その泡には影があるはずです。Unicode を使用し、それを疑似要素に混ぜて三角形を作成できることがわかりました。少し奇妙に見えるので、Unicode 文字をどのようにスケーリングできるか、少し困惑しています。

...:after {
content: "◀";
transform: scaleY(2.5); //doesnt seem to work :-(
top: 50px;
left: -11px;
position: absolute;
text-shadow: -1px 0 2px #ccc;
pointer-events: none; }

これについて助けてくれてありがとう。

4

2 に答える 2

0

元の回答:font-size疑似要素に使用して、テキストを大きくすることができます。を追加するだけfont-size:2.5em;です。

新しいアイデア:質問はコンテンツの矢印を変換することでしたが、吹き出しの代替ソリューションについては知っています。css境界矢印「ハック」を使用するのはどうですか(拡張例を含む以下の私のcodepenリンクを参照してください):

.bubble:after {
  content:"";
  height:0px;
  width:0px;
  border-color: transparent transparent transparent #cccccc;
  border-style: solid;
  border-width: 10px;
  position:absolute;
  top:20px;
  right:-20px;
  /* Now transform will work since this is not a character: */
  -webkit-transform: scaleY(1.5);
  transform: scaleY(1.5);
}

Codepenの例

于 2012-12-14T17:47:23.927 に答える
0

使用する代わりに:

transform: scaleY(...)

使用してみましたか:

zoom:2.5;

ここにフィドルがあります

于 2012-12-14T17:19:29.693 に答える