[CSS]三角・丸・アロー・吹き出し・アイコンなど、全200種以上のさまざまな形状をつくるスタイルシート -Neo CSS
Post on:2012年4月20日
画像を一切使用せずに、さまざまな形状をつくるスタイルシートを紹介します。
![サイトのキャプチャ](/wp-content/uploads-2012/2012042001.png)
[ad#ad-2]
各デモはマウスホバーで、その形状をつくるコードが表示されます。
![サイトのキャプチャ](/wp-content/uploads-2012/2012042002-00.png)
Eample 1
ただ、残念なことにコードに記述がミスがあるため、スタイルシートの部分のみ使用するか、「Download」から一式をダウンロードして利用することをお勧めします。
Example 1のコードは下記のようになります。
HTML
<span class="neo1"> </span>
CSS
.neo1{ width:0; height:0; float:left; border-style:solid; border-color:transparent #555; border-width:32px 0 0 32px; }
[ad#ad-2]
以下に、全226種の中からいくつか紹介します。
![サイトのキャプチャ](/wp-content/uploads-2012/2012042002-01.png)
三角・アロー、白抜きのアローも
![サイトのキャプチャ](/wp-content/uploads-2012/2012042002-02.png)
アローの変形版
![サイトのキャプチャ](/wp-content/uploads-2012/2012042002-03.png)
半円状のハンドル・吹き出し
![サイトのキャプチャ](/wp-content/uploads-2012/2012042002-04.png)
パックマン・パイチャート・時計・パワースイッチ
![サイトのキャプチャ](/wp-content/uploads-2012/2012042002-05.png)
鉛筆・メール・スマートフォン
![サイトのキャプチャ](/wp-content/uploads-2012/2012042002-06.png)
カメラ・虫メガネ
![サイトのキャプチャ](/wp-content/uploads-2012/2012042002-07.png)
ホームアイコンもさまざまなパターンが
![サイトのキャプチャ](/wp-content/uploads-2012/2012042002-08.png)
棒グラフ・折れ線グラフ
sponsors