Posts Tagged CSS

CSSで作るdivボックスデザイン

pタグは文章、tableタグは表と言ったようにタグにはそれぞれ意味があります。しかし、divタグはHTML上意味の無いタグとして扱われます。 そのため、レイアウトやデザインなど装飾に使われます。 今回はそんなdivタグでボックスデザインをい…

Webサイトの読み込み速度を上げるためのJavaScript / css の最適化

Webサイトの読み込み速度を上げるため、JavaScriptとcssを最適化する方法を紹介します。 cssやJavaScriptに改善の余地がある場合は、以下のサイトにURLを入力すると「次のCSS 配信を最適化してください」や「レンダリン…

CSSで作る見出しデザイン

見出しはサイトの見た目を決める上で重要な箇所です。 印象的な見出しは、それだけでサイトを引き立ててくれます。 今回は、そんな見出しのデザインをCSSで10パターン作成してみましたので、参考にして下さい。 見出しデザイン 当ブログの見出し チ…

CSSでヘッダーとフッターを常に固定する

ヘッダーとフッターを常に固定の位置に配置する方法。 前にCSSでフッターを画面下部に固定する方法をUpしたので、今回は常に固定する方法をステップ バイ ステップでご紹介します。 ※CSSでフッターを画面下部に固定する方法はこちら ヘッダーと…

CSSで影を付けるbox-shadowの使い方

box-shadow は、CSS3のプロパティでボックス要素に影を付けることができます。 まずは、box-shadowの基本的な仕様を理解しましょう。 box-shadowの指定方法 box-shadow:横方向 縦方向 (ぼかし) (広が…

ページごとにCSSやJavaScriptの設定ができるWordPressプラグイン「CSS & JavaScript Toolbox」

投稿する記事の量が多くなっていくと、共通のスタイルシートがどんどん膨れ上がりCSSやJavaScriptのメンテナンスが大変になっていきます。 特に、1ページのみに使用する場合やサンプルとして紹介するときなどは、ページ単位で個別の管理がした…

position:「static」「absolute」「relative」「fixed」の使い方

Webサイトを構築していると、稀に必要となってくるpositionプロパティ。 毎回、使おうと思うとどうやって使えばいいのか調べる羽目になってしまいます。 今回はそのposition:「static」「absolute」「relative」…