Wordpress 区切り線 CSS

枠線や区切り線を変えるとサイトがオシャレになったり、読者の注目を引いてに大事な部分を読んでもらいやすくなるなどの効果があります。そこでここではcssだけでグラデーションやシマシマ模様のついた枠線や区切り線を作る方法について解説します。 CSSで、ページ内のコンテンツとコンテンツを仕切る要素として「区切り線」というものがあります。 今回は「hr要素で区切り線をデザインする方法」として、基本的な考え方を中心にご紹介します。 この記事の目次 [前提]リセット用CSSであ CSS グラデーション付きの hr タグを使って線を引く. を使って、hr タグにグラデーションの背景を加えてみました。 記事「Photoshop風インターフェイスで使いやすいCSSグラデーションのジェネレーター | コリス」で紹介されていた、 Ultimate CSS Gradient Generator – ColorZilla.com. CSSの中でも覚えるとかなりデザインを操れるようになる「border」についてです。「border」では「線の種類」「線の幅」「線の色」を変更できます。その上、上下左右を別々に指定できるので便利です … コピペで使える区切り線のインラインcss 2017/6/17 2017/6/26 WEB , インラインCSS ブログサービスごとに記事投稿の機能は、いろいろあるようなのですが、一般的に「見たまま(ビジュアル)編集」と「HTML編集」が選べるかと思います。 文章の長いページを作る際は、以下のような見出しで区切るのが一般的です。 見出し1 見出し2 あるいはブログなどだと、以下のように区切っているケースも見かけます。 ☆☆☆ —— 実はWordPressでは、こんなおしゃれな区切り線が簡単に引けます。 使い方も… ヘッダーメニューの両脇に区切り線を作る方法ヘッダーメニューに区切り線を作ります。最初の状態はこんな感じ両脇に線がありませんね。この両脇に区切り線を加えます。下記のコードをstyle.css追記します。header .smanone ul.m CSSのbox-shadowとtext-shadowで1pxの影をつけるだけで、おしゃれでかっこいい線や文字ができます。さりげないデザインでかっこよさを演出し、読みやすいブログにしてみましょう。ポイントはrgbaの …