CSSCSSを使って複数行の文章の最後に3点リーダーで省略表示する方法
この記事では、CSSを使って複数行の最後に3点リーダーで省略表示する方法を紹介します。以下のCSSを使用して、HTMLとCSSのサンプルコードを示します。サンプルコード<!DOCTYPE html>
<htm...
CSS
CSS
CSSCSSで写真画像に影を利用した装飾を付ける方法
本記事では、CSSを使って写真画像に影を付ける方法を解説します。以下の2つの見出しで、それぞれ異なる影の付け方を紹介します。画像の背景に影をつけるこの方法では、画像の背景に影をつけます。以下のCSSを使用します。
...
CSSCSSを使って画像のアスペクト比を統一する方法
Webページに画像を配置する際、異なるアスペクト比の画像が混在するとレイアウトが崩れたり、見た目が乱れることがあります。この記事では、CSSを使って画像のアスペクト比を統一する方法を解説します。使用するCSSまず、次のCS...
CSSCSSでよく使うプロパティをまとめました
CSSはHTMLを整形し、見た目を整えるために使われる重要なものになります。Webサイトをデザインする上では欠かせないものになるので、よく使うプロパティをまとめてみました。displaydisplayプロパティは、要素の表...
CSSCSS Flexboxを使ってレイアウトの基礎を学習しよう
FlexboxはCSSの強力なレイアウト機能で、簡単にコンテンツを配置、調整、整列できます。今回は、Flexboxの基本的な使い方を学習しましょう。Flexboxの基本的な書き方Flexboxを使うには、まず親要素にdis...
CSSCSS極めたい猫「CSSだけでスムーススクロールを実装」ってどういうこと？
この記事はCSSを学習し、更に学習を重ねたいWebデザイナーやコーダー、エンジニアに向けた記事になります。今まではJavaScriptで頑張って表現していたようなUIなどがCSSだけで実装可能になってきました。その中の一つとして「...
CSSCSS極めたい猫「擬似クラス:root」ってなに？
この記事はCSSを勉強し直したい筆者が纏め直しつつ、CSSをより便利に書けるようになりたい方に向けた記事になります。様々なCSSが使用できるようになってきた中で、カスタムプロパティ（設定用）としてよく活用される「:root」につい...
CSSCSS極めたい猫「擬似クラス:is()」ってなに？
この記事はCSSを学習し、更に学習を重ねたいWebデザイナーやコーダー、エンジニアに向けた記事になります。ここ数年、CSSの使い勝手が劇的に変化してきたように思います。その理由としてはIEをサポートする必要がなくなったということも...