CSS TIPSについて
web標準が騒がれだしてからかなりの時間が流れました。
既にspecer.gifなどを使ったテーブルレイアウトなどのレガシーな手法は過去の遺物となり、(X)HTML+CSSで作成されたサイトが主流となりつつあります。
当サイトは『レイアウトを行う際にどうしてもうまくいかない。』に回答出来る、そんなサイトになりたいと思っています。
HTML+CSSで作成する10の理由
- 構造とデザインの分離ができる
- プログラミングの作業が簡単になる
- SEO効果が高い
- アクセシビリティが高い
- メンテナンス性が高い
- サーバー容量、転送速度の確保が安易になる
- ユーザーが自らの見やすいデザインに変更できる
- ページ表示の高速化
- XMLなどの新しい技術との親和性が高い
- はやってるから
HTML+CSSを学ぶ為には?
当サイトではCSSでレイアウトする為のテクニックを中心に紹介しています。
HTMLやCSSの基礎(~応用)の学習には現場のプロから学ぶXHTML+CSS を利用すると良いです。
初心者には難しいかもしれませんが、 リファレンスとして色々な項目を網羅している為、使える一冊になるのは間違いありません。
CSSの注目情報
- CSSのみで画面の幅と高さのウィンドウサイズを取得する方法|BLACKFLAG
- Web制作者は要チェック! Chrome 132で新しく追加されたCSSとHTMLの3つの新機能
- MPA でページ遷移アニメーションを行う `@view-transition` CSS アットルール
- scroll-state() CSS コンテナクエリを使用して sticky で張り付いたときに境界線を出す
- ユーザーにヒントを表示するための `popover=hint` 属性
- 令和7年版 あなたが使ってよいフロントエンド機能とは
- position: stickyで貼り付いたときだけ境界線を出す(JavaScriptを使わない) - hogashi.*
- CSS text-box-trim | Blog | Chrome for Developers
- コピペするだけで使用できる! ページ上のアクティブなアニメーションを取得するシンプルなJavaScript
- Revealed: React's experimental animations API - Motion Blog
- これどうやるの?2024年Codepenベスト100発表 コピペできるHTMLスニペットまとめ
- これは読まないと! Sassの教科書改訂3版が大幅に刷新、最新のコーディング環境に役立つテクニックを徹底解説
- TailWind CSS v4は便利だぞ
- 2025年、CSSが大革命!知らないと置いていかれる最新アップデート総まとめ - コハム
- なぜYouTubeでは動画を全画面表示しながらスクロールが可能なのか?