[OFFICIAL] [EXIT] [SEOPARTS] [KANAPEDIA]

Cascading Style Sheets

*しゅってん:フリーひゃっかじてん『ウィキペディア（Wikipedia）』*

Cascading Style Sheets
*かくちょうこ*: .css
MIME Type: text/css
*かいはつしゃ:* World Wide Web Consortium
*しゅべつ:* *スタイルシート*
*こくさいひょうじゅん*: Level 1 (Recommendation),

Level 2 (Recommendation),

Level 2 Revision 1 (Candidate Recommendation)
HTML
Cascading Style Sheets

*ダイナミックHTML*
XHTML
*HTMLエディター*
*HTMLようそ*
*HTMLレンダリングエンジン*
W3C
*ウェブブラウザ*

Cascading Style Sheets*（CSS、だんかいスタイルシート、カスケーディング・スタイル・シート、カスケード・スタイル・シート）とは、*HTML*や*XML*のようそをどのようにしゅうしょく（ひょうじ）するかをしじするしようであり、*W3C*によるかんこくのひとつ。ぶんしょの**こうぞう**と**ていさい**を**ぶんり**させるというりねんをじつげんするためにていしょうされた**スタイルシート**の、ぐたいてきなしようのひとつ。*

*CSSはHTMLでひょうげんかのうとかんがえられるデザインのだいぶぶんをじつげんできるようそをとりいれつつ、あらたなデザインきのうをそなえる。また、いかのようなとくちょうをもつ。*

  • *ページをひょうじするメディアにあわせてスタイルシートをきりかえることで、メディアごとにひょうじをへんかさせることができる*
  • *ユーザーエージェント**（おおくのばあい**ウェブブラウザ**）、**ウェブサイト**せいさくしゃ、ユーザがそれぞれていぎしたCSSのもたらすこうかをかさねあわせ（カスケード）ることができる*

*しかし、かくちょう・しゅうせいのつづいているCSSしようのすべてをかんぜんにじっそうしているユーザーエージェントはじじつじょうかいむといってよく、じっさいシェアでたすうをしめるユーザエージェントはぶぶんたいおうにすぎない。しかしじつようじょうししょうのないレベルのじっそうはされてきており、なおかつひょうげんのおたがいのごかんせいについてもこうりょされてきている。*

*もくじ*

[*へんしゅう*] *きじゅつ*

*スタイルのじょうほうはよみこむないよう（さくせいしゃスタイルシート）やユーザーエージェントのせってい（ユーザースタイルシート）のにカショにきさいできる。またユーザーエージェントもどくじのスタイル（デフォルトスタイルシート）をもっている。*

*さくせいしゃスタイルシートはマークアップぶんしょのなかにちょくせつきじゅつするか、べつぶんしょとしてよみこませるかたちでりようされる。CSSのりべんせいをさいだいげんはっきするために、べつぶんしょとしてよみこませることがすいしょうされている。*

[*へんしゅう*] *きじゅつほうほう*

*ここではCSSLevel2についてせつめいする。CSSのぶんぽうはことなるレベルかんでもこうほうごかんせいをもつようにせっけいされており、たとえばCSSLevel1でかかれたスタイルシートをCSSLevel2としてあつかうこともかのうである（ただしいちぶにかいしゃくのそういなどにともなうひごかんぶぶんもそんざいする）。CSSではようそにスタイルをあたえるため、つぎのようなしようがさだめられている。*

*いかのCSSだんぺんをれいにとる。*

p#id { color : #ff3300 }
  • *"{"から"}"までのぶぶんを**せんげんブロック**という*
  • *"p#id"を**セレクタ**（せんたくこ）といい、スタイルがてきようされるたいしょうをしめす*
  • *せんげんブロックとセレクタをあわせて**きそくしゅうごう**という*
  • *"color :#ff3300"ぶぶんを**せんげん**という*
  • *せんげんのうち、":"よりまえ（うえれいでは"color"）を**プロパティ**（とくせい）という*
  • *せんげんのうち、":"よりご（うえれいでは"#ff3300"）を**ね**という*

*うえれいのCSSだんぺんをてきようするとせんげんしているぶんしょのうち、セレクタがしていしているものといっちするぶい（HTMLぶんしょにおいてはようそ、ようそのおやこかんけい、とくていのクラス、IDなど）に、せんげんブロックないのせんげんがてきようされる。せんげんは、「プロパティ:ち」か、「そら（なにもきじゅつしない）」のどちらかでこうせいされ、プロパティ、":"、ちのぜんごにはくうはくもじ（スペース、タブ、かいぎょうなど）をじゆうにいれられ、また";"でくぎることによりせんげんをならべてかくことができる。*

*うえれいはHTMLぶんしょにてきようするばあい、「idというIDをもったpようそのもじしょくをあかFF(=255)、みどり33(=51)、あお0にせよ」というしていをいみする。*

color : #ff3300*;*width : 35%

color : "#0033ff"*;*width : '53%'

*このようなせんげんがあったとき、こうしゃふたつは""や''をふしたためにふせいである。なぜなら、""や''でかこったものはもじれつとしてあつかわれ、colorプロパティがとりうるいろのね（#rrggbb、rgb([0-255],[0-255],[0-255])、または、blackやredなどのキーワードなど）ではないからである。CSSではプロパティごとにとれるこうぶんがさだまっており、それいがいのねがはいっていたばあいはむししなければならないとされているため、ちゅういがひつようとなる。*

p#id { color: #ff3300 }
p#id { font-size: 24px }

*は、*

p#id { color: #ff3300*;*font-size: 24px }

*ととうかである。;はぜんしゃのようにせんげんをセレクタにひとつずつかいてあるのを、ひとつのセレクタのブロックできじゅつするときにせんげんをわけるのにつかう。そのため、かならずしもせんげんに;をつけるのをきょうせいするものではない。*

*セレクタは、じっそうレベルのたかいブラウザならばどのぞくせいであってもCSSをてきようすることがかのうであり、このばあいIDにかんするぞくせいセレクタであるので、#idは[id="id"]ととうかである。セレクタのかんたんなマッチングがかのうである。そのほかHTMLタグにたいするてきよう、ぶんしょこうぞうからみたこ・きょうだいこうぞうへてきようするセレクタ、さらにはリンクやどうてきなひょうげん・げんごにかんするぎじクラス(:link、:hover、:lang)などがある。*

[*へんしゅう*] *ユウセンじゅんい*

*CSSはかならずしもひとつのところでいちいにしていできず、そのためしていないようのしょうとつをさけるためにユウセンじゅんいがユーザーエージェントによってけいさんされる。そのけっかは、いかのようなじょうけんによりさんしゅつされる。*

  • *さくせいしゃスタイルシートはユーザースタイルシートよりユウセンされる*
  • *デフォルトスタイルシートはたのスタイルシートをユウセンする*
  • *さいじゅうようしていされているせんげんはユーザースタイルシートがさくせいしゃスタイルシートよりユウセンされる（CSS1ではぎゃく）*
  • *がいぶからよみこんだものはよみこんださきとまとめてあつかう*
  • *しょうさいどによってせいりする*
    • *そのセレクタないでしていさきをいちいにきめられるもの（IDのるい）がおおいほうをユウセンする*
    • *IDのるいによるユウセンじゅんいがおなじばあいは、ぞくせいやぎじクラスのかずがおおいほうをユウセンする*
    • *それでもユウセンじゅんいがきまらないばあいは、ようそのかずがおおいほうをユウセンする*
  • *これでもまだユウセンじゅんいがどういつのばあい、さくせいしゃスタイルシートにおいていかのじゅんでユウセンする*
    1. *インラインのもの*
    2. *がいぶからのもの*
  • *HTMLのalignぞくせいなど、CSSいがいによるスタイルのしていは、それととうかなCSSによるスタイルしていがせいさくしゃスタイルシートのせんとうにあるものとしてあつかう。ただし、これらのしょうさいどはもっともひくいものとする（CSS1においてはようそめいによるしていをひとつだけふくむセレクタとおなじしょうさいど）*

*きさいかのうなほうほうのしょうさいはつぎのとおりで、いっぱんてきにユウセンされるじゅんいでならびかえている（CSS2でさいじゅうようしていのユウセンじゅんいのしようがへんこうされている、かんこく6しょう4）。*

  1. *ユーザスタイルシートちゅうでさいじゅうようしていされたせんげん-ユーザーエージェントのせっていのスタイルのなかで!importantをせんげんにふかする*
  2. *さくせいしゃスタイルシートちゅうでさいじゅうようしていされたせんげん-さくせいしゃがないようにふずいさせたスタイルちゅうで!importantをせんげんにふかする。*
  3. *さくせいしゃスタイルシートちゅうのつうじょうのせんげん*
  4. *ユーザースタイルシートちゅうのつうじょうのせんげん*
  5. *デフォルトスタイルシートのせんげん*

*さくせいしゃスタイルシートのきじゅつほうほうによるユウセンじゅんいはいかのとおり。*

  1. *とくていのようそにスタイルをきじゅつする*
  2. *HTMLやXMLのヘッダぶにそのページぜんたいをたいしょうにスタイルをていぎする*
  3. *CSSのみをきじゅつしたがいぶファイルをよういし、HTMLファイルのヘッダぶからリンクをハッてスタイルをさんしょうさせる*


[*へんしゅう*] *かんこくとう*

*CSSのバージョンはふくすうあり、げんざいLevel1とLevel2、そしてかいはつちゅうのLevel3がある。しょうさいはがいぶリンクさんしょうのこと。*

[*へんしゅう*] *CascadingStyleSheets,level1(CSS1),かんこく1996ねん12つき*

*ボックスモデルのさんこうず*

*マージン*

*ボーダー*

*パディング*

*ないよう*

*パディング*

*ボーダー*

*マージン*

*ボックスに*width*ぞくせいをせっていしたとき、*W3C*のボックスのモデルではないようのよこはばであるとかいしゃくされる。そしてパディングとボーダーぶんのよこはばはようそのよこはばについかされる。*

*たほう**マイクロソフト**のボックスのモデルではwidthぞくせいはないようのよこはばとパディングとボーダーぶんをたしたもの、すなわちようそすべてのよこはばになる。*

*そのためふくすうのブラウザでこのモデルをつかうのはよういでない。これをかいひするには、パディングとボーダーを0にする。ほかのかのうせいはリンクセクションのハックをつかうてがある。*

*しかしInternetExplorer6ではDOCTYPEがせいかくならばひょうじゅんじゅんきょモードにいこうできる（ただXMLやXHTMLのばあい、XMLせんげんをしようどおりかくとかこごかんモードではしってしまうバグがある）。*

[*へんしゅう*] *CascadingStyleSheets,level2(CSS2),かんこく1998ねん5つき*

*CSS2はCSS1のじょういごかん。いくつかのがいねんのついか・かくだい・かいていがおこなわれた。*

*ぐたいてきにはひょうじばいたい（モニターやTV、かみばいたいなど）によってじどうてきにスタイルシートをへんこうできるようにし、それにふずいして**おんせいブラウザ**へのたいおう、いんさつばいたいへのたいおうがおこなわれ、フォントなどのひょうじきのうのかくちょうや、ボックスのがいねんのしゅうせいなどがおこなわれた。*

*ただし、2002ねんごろいこうにはっぴょうされたCSSたいおうUAで、これをしようとみなしているものはそんざいせず、じっしつてきに、CSS2.1にしようとしてのやくわりをゆだねたかたちになっている。W3CのCSSトップページからも、2004ねんにさくじょされ、CSS2.1にへんこうされている。*

[*へんしゅう*] Cascading Style Sheets, level 2 revision 1 (CSS2.1)

*CSS2のマイナーチェンジとなるバージョン。text-shadowプロパティのように、CSS2でさくていされていながらもほとんどじっそうされないしろものなどがさくじょされている（それらはCSS3でていぎされなおすことになる）。*

*そそがれたじかんとろうりょくはたのCSSしようのひではない。CSSのじっそうにさいしてベンダは、2002ねんごろからCSS2.1をきほんしようとみなしている。*

*2007ねん7つきじてんでかんこくこうほ(CandidateRecommendation)がこうかいされている。*

[*へんしゅう*] Cascading Style Sheets, level 3 (CSS3)

*CSS3ではぜんたいが**モジュールか**され、ユーザーエージェントがどのモジュールにたいおうし、どのモジュールにたいおうしないかじゆうにせんたくできるようになるほか、たてほうこうのしょじや、HTMLいがいのきかくにまでかんよしたないようとなっている。げんざい、どのモジュールもかんこくにはいたっていない。*

この節は執筆の途中です *このふしは**しっぴつちゅう**です。**かひつ、ていせい**してくださるきょうりょくしゃをもとめています。*

[*へんしゅう*] *かんれんこうもく*

[*へんしゅう*] *がいぶリンク*

ウィキブックス
*ウィキブックス**に*CSS*かんれんのきょうかしょやかいせつしょがあります。*
World Wide Web Consortium*のひょうじゅん*
*W3Cかんこく*
CDF* ?* CSS* ?* DOM* ?* HTML* ?* MathML* ?* OWL* ?* RDF* ?* RDF Schema* ?* SVG* ?* SOAP* ?* SMIL* ?* SPARQL* ?* VoiceXML* ?* WSDL* ?* XHTML* ?* XML* ?* XForms* ?* XML Information Set* ?* XML Schema* ?* XPath* ?* XQuery* ?* XSL* ?* XSL Transformations* ?* XSL Formatting Objects* ?* XLink* ?* XML Base* ?* XInclude* ?* *XMLしょめい*
Notes
*ワーキングドラフト*


加筆して下さる協力者を求めています *この「*Cascading Style Sheets*」は、**インターネット**や**ウェブ**にかんれんした**かきかけこうもく**です。**このきじをかひつ**してくださるきょうりょくしゃをもとめています（**P:コンピュータ**）。*
"http://ja.wikipedia.org/wiki/Cascading_Style_Sheets*"よりさくせい*