カテゴリー

HTML/CSS
JavaScript
WordPress
GSAP
Other

お問い合わせ

ホーム
お問い合わせ
HTML/CSS
JavaScript
WordPress
GSAP
Other

ホーム
アスペクト比

アスペクト比

HTML/CSS 2026.08.31

【CSS】たった1行でアスペクト比を維持！aspect-ratioを使ったモダンな比率固定テクニック

Author: みかん箱

北海道札幌市在住。
web制作技術の定着の為、記事としてまとめアウトプットしていきます。
最近はGSAPを勉強中です。

GitHub Portfolio

カテゴリー

HTML/CSS 25
JavaScript 18
WordPress 2
GSAP 16
Other 2

最近の投稿

【JavaScript】「いいね」「お気に入り」機能の実装に最適！Setオブジェクトでデータを管理する方法

【CSS】display: none はNG？画面から隠して読み上げブラウザに伝える Visually Hidden

【CSS】transformテクニック！要素を円形（時計状）に均等配置するレイアウト術

【CSS】もう迷わない！要素を中央揃えする3つの王道メソッド

【GSAP】stagger で複数要素を順番にアニメーション！stagger の便利な使い方とデモ3選！

タグ

省略文字アスペクト比 font-size clamp CSS小技 CSSテクニック変形アニメーション SVG MorphSVGPlugin CSS変数疑似要素ローディングUI 実装アイデア行数制限テキスト制限マウスストーカーシンプルローディングアニメーション TextPlugin mix-blend-mode フィルター shadow 影要素取得データ管理 Setオブジェクトスクリーンリーダー visually hidden レイアウト transform 中央揃え stagger Map 連番リストスタイル操作 sticky grid flexbox data属性 Math クラス判定 UI実装非同期処理命名規則スクロール判定軽量化整形処理基本操作配列操作装飾 clip-path 疑似クラスホバー演出 hover resize クラス付け替え ScrollTrigger スプレッド構文クラス付与 Intersection Observer 固定ヘッダースムーススクロール ScrollToPlugin レスポンシブ文字列スクロールプラグインテキスト timeline 便利ツールジェネレーターダミー画像プログレスバーパララックス文字分割テキストアニメーション SplitText if文スクロール禁止ハンバーガーメニューボタン横スクロール matchMedia mixin メディアクエリ scss リダイレクト処理 Contact Form 7 mask-image テキスト演出分割代入

Web制作技術の定着の為、
技術をアウトプット!!

Category

HTML/CSS
JavaScript
WordPress
GSAP
Other

About

お問い合わせ
Privacy Policy

Link

GitHub
Portfolio

© 2026 Mikanbako Docs.