2016年12月6日(火)
[CSS]順序付きリスト、ol要素を丸数字で実装するスタイルシートのテクニック -spanや①は無し
Webで調べると、ol要素を丸数字で実装する時はspanとか①②③とかを使うしかないように思えますが、クリーンなHTMLで数値文字参照を使わずに、丸数字を実装するスタイルシートのテクニックを紹介します。
対応ブラウザはすべてのモダンブラウザで、IEは8+です。
ol要素を丸数字で実装するテクニックはこちら。
丸の形やサイズやカラーなど、デザインを変更することもできます。![[CSS]順序付きリスト、ol要素を丸数字で実装するスタイルシートのテクニック -spanや①は無し](https://upde.jp/wp/wp-content/uploads/2016/12/2016120603-220x138.png)
Styling numbers
HTML
HTMLは、olのリストを普通に記述するだけです。
順序付きリスト 順序付きリスト 順序付きリスト 順序付...
0
109
110
248author:
コリス
2006年の開設以来、一貫してサイト制作に関する最新情報を提供しているクリエイティブブログ
‹ PREV
ページ読了後等にコンテンツをスライドさせて次の情報に誘導できる「jquery-slidebox」
NEXT ›
クリエイティブなホバーアクションを簡単に実装する「Tilt Hover Effects」
Ads
2006年の開設以来、一貫してサイト制作に関する最新情報を提供しているクリエイティブブログコリスの記事『[CSS]順序付きリスト、ol要素を丸数字で実装するスタイルシートのテクニック -spanや①は無し』についてまとめています。
この記事は特にSEO・Mac・LINEについて書かれており、 HTML+CSSコーディングのカテゴリーに分類されます。気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のコリスで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとコリスの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。
Ads
