他の新着情報はこちらから
« CSSのみでホームページを制作したい〜画像の上に文字をのせるとか | SEO対策と表示順位の大変動 »
SEO対策
htmlのbodyの中にスタイルを書き込んで、丸数字を書いてみた
htmlのbodyにスタイルを書くことができます。
実際のホームページ制作ではあまり必要ではなさそうですが「このページだけこのCSSを書きたい!」という時や、忘備録用に記録しておきたいと思います。
1 2 3 |
<style scoped>この中にCSSを書きます。 wordpressの設定によっては、brが入ってしまうので見づらいですが改行なしで書いた方がよさそうです。 以下の「h5」のスタイルをbodyの中に書きました</style> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
h5{ color: #007440; padding: 0; margin: -15px 5px 0px 0px; width: 50px; height: 50px; line-height: 50px; text-align: center; display: inline-block; border-radius: 50%; font-size: 160%; font-family: 'Saira Semi Condensed', sans-serif; border: 2px solid #007440; } h5{ clear: both; margin: 30px 0px 0px; padding: 0px; font-size: 150%; color: #007440; font-weight: bold; } |
リストや画像を使わずにCSSでまる数字を書く
実際にhtmlで書き出してみるとこんな感じです。
1
今回参考にさせていただいたサイトです
CSSで文字を、円の上下左右中央ド真ん中に表示する方法。
こちらの記事もオススメです
新着情報一覧
ホームページ制作にまつわる便利な情報を長野より発信!
-
【css】1段目を写真右、2段目を写真左でレイアウトしたい時(wordpress対応)
-
wordpress5.51にしたらMW WPからのメールがエラーになる件
-
wordpressで投稿、カスタム投稿、カテゴリ別に表示件数を変える
-
郵便番号から住所をフォームに自動入力するJS(wpじゃない時)
-
高さを指定しないで中央に
-
Safariにのみ適用させるCSSハック
-
ショッピングサイト「ベイス」でのスライダー
-
wordpress更新でホームページ(頭の中も)が真っ白になる