【6】CSSって具体的に何ができる?(プロパティについてざっくりと)

CSSは、セレクタ { プロパティ : } というカタチが基本ですね。
【2】CSSはどうやって使うの?(基本構造とCSSを置く場所について)で詳細を)

セレクタは、HTML要素をセレクトするもの。
セレクトされた要素に、スタイルを与えるのが プロパティと そのです。

CSSでは、きめ細かいレイアウトができるように、プロパティが数多く用意されています。
それぞれのプロパティによって、の指定の仕方もいろいろです。
すごい数なので、全部覚えるのは無理。
よく使う基本的なプロパティは、わりと限られているし(文字やボックスのサイズなどをよく使います)
繰り返し使ううちに、スタンダードなモノはすぐ覚えられます。

今回は、どんな種類のプロパティがあって、何ができるか、だけをざっくりと整理してみました。

こんなプロパティがあります

プロパティは、まず大きく分けて
ディスプレイ用(見た目のスタイル)
音声用(音声ブラウザ用のスタイル)
印刷用(印刷時のスタイル)
があります。

このうちディスプレイ用のプロパティは、ざっとわけてこの2タイプあり。
ほぼどんな要素にも使えるものメタデータ・コンテンツ以外の要素に使います)
特定の要素専用のもの(Table, List, Ruby関連の要素専用のスタイルがあります)

メタデータ・コンテンツとは、<title> <base> <link> <style> <meta> <script>などの要素。
ユーザの目に触れない、メタデータのための要素です。ってことで、スタイルを適用しても意味が無いのね。
(メタデータ・コンテンツについての詳細は、[40] メタデータ・コンテンツって何?をご覧ください)

プロパティの分類を、図にしたらこんなかんじ。ものっすごく大雑把だけど。
プロパティの種類

CSS1、CSS2、CSS3 とレベルが上がるたびに、プロパティもセレクタもどんどん増えていきました。
CSS3からのモノも、途中で仕様変更になったり、ブラウザが未対応だったり、ややこしい。
そしてもうCSS4 も策定中(セレクタがさらに細かく指定できるようになるそうです)

でも、こうしてセレクタやプロパティの数が増えるほど、より細かなレイアウトができるようになるんですよね。ありがたいことですw。
しかし、新しいものを追いかける前に、基本的な知識を蓄えておかないと。
また、Scss(Sass)を使うにしても、CSSの基本をわかっていて、正しいコードを書けなければ、使えませんもんね。

Sass(Syntactically Awesome StyleSheet)とは、CSSを生成する言語。
ネスト(入れ子)、変数、条件分岐などの機能が使えます。CSSでは何度も同じコトを書かなきゃイケナイ場合もありますが、そのコードをコンパクトにまとめることができます。よりCSSに近いコードで書けるScss(Sassy CSS)のほうが普及しています。

というわけで、CSSの基本をとにかく勉強していきましょう。
この「ほんっとに...」では「ディスプレイ用」のスタイルを中心に話を進めていく予定です。

次回予告

CSSで指定するスタイルで、よく使うのは「サイズと色」。
文字やボックスのサイズを決めて、色を指定します。紙媒体でのレイアウトでも同じですね。
そこで次回は、サイズ指定の「単位」について。相対単位と絶対単位を使いこなしましょう。

関連記事
この記事をはてなブックマークに追加

やる気を保つためにランキングに参加しています。
応援してくださると すっごいやる気を出します! (笑)

初心者にも使いやすい(と思う)レンタルサーバー

最近よく「レンタルサーバーはどこがいい?」とご質問が来ます。
自分でも使っていてオススメなのはミニバード。管理画面がわかりやすくていい感じす。
仕事で使ってるロリポップもわかりやすい管理画面で、初めてでもすんなり使えると思います。
両方とも、なんといっても料金が安いです。初めてだとなるべく安いほうがイイですからね。

それよりちょっと料金は高いけど、高スペックでコスパが良く、信頼性も高いサーバといえば、やはりさくらのレンタルサーバと、XSERVER(エックスサーバー)だと思う。この2つは老舗でユーザーも多いので、質問する場がたくさんあり、初心者の方でもイケるだろうと思います。

レンタルサーバーは、たくさんあり過ぎて迷いますよね。近いうちに、初心者にも良さげなサーバーについて記事にまとめます。*記事をアップしたらココにもリンクを貼ります。

スポンサーリンク

コメントの投稿

スポンサーリンク
最新記事
Category
オススメの本
Links
Calendar
07 | 2017/08 | 09
- - 1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31 - -
Archive
RSS Link
Profile

yuki★hata

Author : yuki★hata
せめて月1回の更新をめざします~。

メールフォームはこちら

スポンサーリンク
スポンサーリンク
Copyright © ほんっとにはじめてのHTML5とCSS3 All Rights Reserved.