![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
「.NET 開発基盤部会 Wiki」は、「Open棟梁Project」,「OSSコンソーシアム .NET開発基盤部会」によって運営されています。
https://ja.wikipedia.org/wiki/Cascading_Style_Sheets
CSSの仕様はレベルという段階をもち、Level 1 - 4 までの仕様が公開されている。
Level 3モジュールで
半角小文字で以下のように書く。
セレクタ{プロパティ:値;}
styleの適用される要素を選択する。
余談：jQueryのセレクタもこのCSSセレクタを使用している。
タグ名{プロパティ:値;}#id値{プロパティ:値;}.class名{プロパティ:値;}タグ名[属性名]{プロパティ:値;}
タグ名[属性名=属性値]{プロパティ:値;}*{プロパティ:値;}タグ名#id値{プロパティ:値;}
タグ名.クラス名{プロパティ:値;}セレクタ1,セレクタ2, ...セレクタn{プロパティ:値;}先祖セレクタ 子孫セレクタ{プロパティ:値;}親要素>子要素{プロパティ:値;}前要素+後要素{プロパティ:値;}前要素~後要素{プロパティ:値;}a:link {color:red;}a:visited {color:red;}a:hover {color:red;}a:active {color:red;}input:focus {background:red;}p:lang(en) {color:red;}li:first-child {color:red;}p:first-line {color:blue;}p:first-letter {color:blue;}blockquote:before {content:"『";}blockquote:after {content:"』";}タグのstyle属性に直接各場合は、要素を特定するためのセレクタは不要。
<p style="color:red">XXXXXXXXXX</p>
以下のようにheadタグ内でリンクする。
<head>
・・・
<style>
p {color:red;}
</style>
・・・
</head>
書き方はstyleタグ内部と同じ。
以下のようにheadタグ内でCSSファイルをリンクする。
<head>
・・・
<link rel="stylesheet" href="style.css" type="text/css">
・・・
</head>
@import url("handheld.css") handheld;@media print {
body { font-size: 9pt; }
}<link rel="stylesheet" type="text/css" media="print, handheld" href="foo.css">
HTML5にデフォルトCSSの指針があるが実装はブラウザごとに異なる。
このため、問題が発生することがある。
この問題を解決するために、リセットCSSというものが提供されている。
以下のサイトでダウンロード数から人気のリセットCSSを確認できる。
下記を参考にすると、
CSSフレームワークの機能は
の3レイヤに分類できる。
１つのCSSフレームワークに実装する機能レイヤ数に依って
に分類できる。
コンポーネントについては、以下の観点から利用にリスクがある。
上記の定義（分類）によると、フルスタックなCSSフレームワークに該当する。
