HTMLのテキストやブロック要素を右寄せにするCSSの書き方
HTMLは基本左寄せなので、左寄せに関しては問題ないです。 しかし、右寄せは自分でCSSを作成しないと右寄せになりません。 それもテキストなどのインライン要素とブロック要素では方法が異なります。 HTML基本サンプル 先…
プログラマーの技術や経験の暴露ブログです。何か聞きたいことがあれば遠慮なくご連絡ください。
HTMLは基本左寄せなので、左寄せに関しては問題ないです。 しかし、右寄せは自分でCSSを作成しないと右寄せになりません。 それもテキストなどのインライン要素とブロック要素では方法が異なります。 HTML基本サンプル 先…
最近は、PCで表示した場合とスマホで表示した場合で、表示の仕方を変える場合がほとんどだと思います。 そしてその実現手段としてCSSで画面幅ごとに対応していく場合があります。 例えばPCではヘッダー部にメニュ…
HTMLベタ書きじゃない限りWEBサイトには管理画面がつきものです。 今回はその管理画面を作るにあたってきれいなテンプレートが世の中にたくさんあるので紹介しようと思います。 管理画面はSEOもとくに意識する…
ちょっと昔僕がはまった単純なHTMLの罠の話です。 ブロック要素は通常連続して書くと横幅の設定値に限らず改行されて縦に並びます。 displayプロパティに inline-block を設定すると、ブロック要素のようだけ…
今日はCSSでHTML要素にグラデーションを描く方法です。 グラデーションをうまく活用するとサイトのデザインがぐっと良くなると思います! 画像に透明のグラデーションをかぶせたりするのも最高です! CSSでグラデーションを…
今回は非常に地味ですが、CSSで台形を描く方法です(笑) だいぶ前ですが、フッターの上に同じ色で台形のページトップへ戻るボタンをつけてくれと依頼されました。 同じ色で台形の画像を作成して配置すれば簡単ですが、ブラウザで表…
通常はHTML要素は左上から順に構築されます。 文章を書いても画像を貼り付けても、左上を基準に配置されます。 でも時には真ん中に表示させたいときもあると思います。 今回は、上下左右の中央、つまりど真ん中に画像やブロック要…
基本的にHTMLは四角のエリアや画像などを組み合わせて構築するのでどこか刺々しく感じます。 角を取り丸くすることによってサイト全体が柔らかい雰囲気になるのではないでしょうか。 例えば、下のような画像がありま…
前回の記事でjQueryを使ってサイドバーを追従する方法をご紹介しました。 jQueryでサイドバーを追従させる方法 フッターやコンテンツエリアの位置情報を取得したり、面倒ですよね。 スクロールする度に起動されるので環境…
結論を言えば、transparent をカラーに指定すれば透明になります。 部分によりますが、背景色だったら透明(transparent)が初期値だと思います。 背景色を無しにする場合はこのように書きます。…