CSS レスポンシブでdivや動画などの縦横比(アスペクト比)を固定して要素の高さを可変にする方法【CSS】 レスポンシブサイトで動画やiframeなどで横幅が変わっても、高さもきちんと元の比率を固定して表示されるように対応するためのCSSをご紹介。divなどでも使えます。 2022.07.21 CSS
CSS videoタグで埋め込んだ動画に自作再生ボタンをつける方法 videoタグで張り付けた動画に自作の再生ボタンと停止ボタンを付ける方法を紹介していきます!特に消音で動画を挿入する場合で、再生・一時停止・再生位置の移動やボリュームなどのインターフェースを表示したくないけど最低限の再生・停止ボタンは付けたいという場合に。 2022.07.20 CSSjQuery
CSS ページ内リンクがずれる場合の対処方法について 画像に遅延読み込みの処理を施した際に外部ページから特定の位置へのリンクがずれることがあるので、このような場合の解決方法をひとつ記載しておきます。今回は画像のアスペクト比を保つ処理を行って要素に高さを持たせることで解消できましたので参考にしてみてください。 2022.06.07 CSS
flexbox 【Flexbox】横並びデザインの子要素・孫要素の高さを揃える! Flexbox横並びレイアウトを、子要素・孫要素まで高さを揃える方法を出来る限りわかりやすく解説していきます。子要素は親要素にdisplay:flex;を指定すると、簡単に高さが揃いますが孫要素は少し工夫が必要です。 2021.11.29 flexboxCSS
flexbox 【Flexbox】横並びデザインの画像の高さを揃える方法 Flexbox横並びデザインの画像の高さを揃える方法について解説しています。画像の高さが揃わないという問題を解決!整ったレイアウトでホームページを制作しましょう。 2021.11.20 flexboxCSS
CSS ホームぺージに使用する画像の設定方法【基礎編】 ホームぺージに使用する画像の設定方法について解説しています。基本的な設定を知りたい、画像下の余白を消したいときなど、基礎編として紹介しています。 2021.11.15 CSSHTML