Quantcast
Channel: CSSタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 8652

HTML CSS アイコン 要素の透明化

$
0
0

HTML上でTwitterなどのアイコンを表示する方法

HTML上でTwitterやFacebookなどのアイコンを表示するにはFont Awesomeというものを使用します。
使用方法の手順としては、まず初めにhead内でFont AwesomeのCSSファイルを読み込むことです。
次の手順はspanタグにfaクラスとfa-twitterなどのfa-アイコン名クラスを指定することです。
上記の2手順だけでアイコンを表示することができます。

ex<span class="fa fa-facebook">
とすることでfacebookのアイコンが表示されます。

またspanでくくっているためテキストの間に入れることができます。

要素の透明化について opacityとrgba 

要素を透明にするには主にopacityとrgbaの2種類を使用します。
opacityは要素を透明にするためだけに使用されるのに対して、rgbaは要素の色も指定します。
またopacityは中身全体を透明化するという性質があるのに対してrgbaは背景色のみなど、その色だけを透明化することが可能です


Viewing all articles
Browse latest Browse all 8652

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>