CSS 見出しジェネレーター

CSSで見出しタグを作ってみましょう。

記事内で使う見出しは基本的にh3タグで統一するのが一般的です。

最初は手打ちでCSSを書く事は難しいと思うので、ツールを使って見出しを自作してみましょう。

見出し生成ツール

見出しはこんな感じのやつです↑

記事内の見出しを付けると、読みやすくなっていいですね。

見出し作成ツールはこちら。

CSS見出し ジェネレータ

ここで枠色や背景、スタイルなどを、視覚的に作成してみましょう。

CSSジェネレーター

出来上がったら「ジェネレート」をクリックすると、CSSコードとHTMLコードが自動生成されます。

CSSジェネレーター

まずは、CSSコードの部分を、自分のスタイルシートに貼ります

ワードプレス管理画面から→外観→テーマ編集から、自分が使っているスタイルシートを選択して、貼り付ければOKです。

HTMLコードの部分は、記事内の表示させたい部分に貼りましょう

注意すべきは、元々h3タグにCSSが指定してあるようだと、うまく出力されない時があります。

そういった場合は、元々入ってるh3のCSSを削除してから使うようにして下さい。
スタイルシート内で、「CTRL+F」でh3をページ内検索して見つけましょう。

動画説明

他のツールにも応用

見出しタグだけでなく、個々のサイトでは他のタグも作成できます。

WEB便利ツール

色々便利なツールがあるので使ってみて下さい。

基本的には使い方はこの見出し作成ツールと同じです。

投稿日:2015年5月12日(火) 07:49

コメントを入力

You must be logged in to post a comment.

TOP