Webエンジニアのブログ

CSS 一覧

メインコンテンツより画像や動画のコンテンツ幅を広くするHTMLマークアップとCSS設計

Webページのデザインを作成する中で、見出しや文章のコンテンツに対して、画像や動画をフルスクリーンまたはワイドに表示させるデザインを採用することもあるでしょう。 スマートフォンやタブレット端末でも、画像を大きく表示するほうが、コンテンツに関...
続きを読む>>

2020/10/14|WEB

display: flow-rootによるfloatの回り込み解除

Web制作において、コンテンツの横並びには、flexboxやfloatプロパティを利用していくと思います。 flexboxを利用する場合には、横並びの他にもいろんなオプションで変化を加えることができます。またシンプルに横並びを実装する場合は...
続きを読む>>

2020/08/04|WEB

CSSのfocus-within擬似クラスを使った要素のデザイン

昨今のWebサイトのフォームデザインでは、UXの面でユーザーにストレスなくわかりやすいデザインが求められます。ラベルや入力フィールドをグループ化したレイアウトからプレースホルダテキスト、ヘルプテキスト、エラー表示などなど、フォームのデザイン...
続きを読む>>

2020/03/01|WEB