タグ

2016年8月11日のブックマーク (1件)

  • CSSでリンク横に「参考・LINK」バッジをつけてみよう | vdeep

    こんにちは、okutani(@okutani_t)です。今回は、リンク横にCSSでかわいいバッジをつける方法を解説いたします。 バッジを作るだけなので拍子抜けするぐらいかんたんです。CSSがあんまりよく分からない方でもコピペで作れますので、お気軽に試してみてください。 HTML+CSSで作っていくので、WordPress等のCMSでも同じように表示されるはずです。WordPressで運営している当サイトでも、記事の方法でバッジを設置しています。 ではさっそくCSSでバッジをレイアウトしてみましょう。 スポンサーリンク バッジを並べるにはspanタグを使おう! 文字の横に並べて何かを表示したいときは、spanタグを使うと良いです。 CSSでレイアウトできるように、classもつけておきましょう。 <span class="sankou-badge">参考</span> この右隣にテキストリ

    CSSでリンク横に「参考・LINK」バッジをつけてみよう | vdeep