0

text-shadowアイコンの周りに境界線を配置したい、つまり、深さや寸法を指定したいのですが、CSS のプロパティを使用する必要があるようには見えません。

Twitter Bootstrapと共に使用されるFontAwesome アイコン コレクションを使用しています。

以下は、JSFiddle デモ (HTML と CSS も下に示されています) へのリンクです。上向き矢印と下向き矢印があり、より質感を高めたいと思います。

http://jsfiddle.net/trpeters1/PcmNC/14/

HTML:

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap.no-icons.min.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.0/css/font-awesome.css" rel="stylesheet">

<ul class='well'>  
   <li class='alignCenter'> 
     <i class='icon-caret-up icon-green icon-4x'></i>
   </li>
   <li class='voteTots alignCenter' >3</li>            
   <li class='alignCenter'> 
     <i class=' icon-caret-down icon-gray icon-4x'></i>           
   </li>
</ul>

CSS:

body {
  font-size:200%; /* resets the page font size */
}
ul li.alignCenter{
  margin:auto;
  width:50%;
  text-align:center;
}
.icon-green{
  color:#58A279;    
}
.icon-gray{
  color:gray;   
}
.voteTots{
  font-size:60px;
  color:#666;
}
4

1 に答える 1

0

テキストの影が必要なものではありませんか?

これをチェックしてください：http://jsfiddle.net/panchroma/PcmNC/17/

用途 

.shadow {
text-shadow: 5px 5px 5px #666; /* horizontal vertical blur colour */
}
于 2013-01-06T18:25:39.210 に答える