ホームページ >ウェブフロントエンド >htmlチュートリアル >HTML 5 スタイルシートのリセット_HTML/Xhtml_Web ページの制作

HTML 5 スタイルシートのリセット_HTML/Xhtml_Web ページの制作

WBOY
WBOYオリジナル
2016-05-16 16:42:381709ブラウズ

この CSS リセットは Eric Meyers の CSS リセットに基づいて修正されており、特に HTML5 の対応するタグの初期化スタイルを調整しています。

/*
html5doctor.com スタイルシートをリセット
v1.4
2009-07-27
著者: Richard Clark - http://richclarkdesign.com
*/

html、本文、div、span、オブジェクト、iframe、
h1、h2、h3、h4、h5、h6、p、blockquote、pre、
abbr、アドレス、引用、コード、
del、dfn、em、img、ins、kbd、q、samp、
small、strong、sub、sup、var、
b、i、
dl、dt、dd、ol、 ul、li、
フィールドセット、フォーム、ラベル、凡例、
テーブル、キャプション、tbody、tfoot、thead、tr、th、td、
記事、脇、ダイアログ、図、フッター、ヘッダー、
hgroup、メニュー、ナビゲーション、セクション、
時間、マーク、オーディオ、ビデオ {
マージン:0;
アウトライン:0; 🎜>フォントサイズ:100%;
垂直整列:ベースライン;
}
ボディ {
行の高さ:1;
記事、サイド、ダイアログ、図、フッター、ヘッダー、
hgroup、nav、セクション {
display:block
}

nav ul {
list-style; :none;
}

blockquote, q {
quotes:none;

blockquote:before, blockquote:after,
q:before, q :after {
コンテンツ:";
コンテンツ:なし;

a {
パディング:0;
フォントサイズ:100%;
背景:透明;

ins {
背景色:#ff9; >color:#000;
テキスト装飾:なし;

マーク {
背景色:#000; style:italic;
font-weight:bold
}

del {
text-decoration: line-through;

abbr , dfn[title] {
border-bottom:1px dotted #000;
cursor:help;

table {
border-collapse:collapse; -spacing:0;

hr {
display:block;
border:0; ボーダートップ:1px;
margin:1em 0;
padding:0;

入力、{
vertical-align:middle
}

コンテンツを更新しますか?



など、HTML5 でサポートされていないタグ スタイルを削除しました...HTML5 に新しいタグ スタイルを追加し、デフォルトのパディング、マージン、境界線を削除しました。OK 表示属性がブロックレベル要素として表示される要素のうち、ブロックはブロックです。

は属性セレクターを使用します。

は、これら 2 つの要素に title 属性がある場合に、そのスタイルを指定します。アクセシビリティの観点から検討します。

ディスカッション

アウトライン:0 をアンカー ポイントに追加すると、アクセシビリティに重大な問題が発生し、キーボード ナビゲーションの失敗に直接つながります。

内、マークは、フォントの色が設定されていない場合、背景色を追加する必要はありません。

詳細なコンテンツについては、ここをクリックしてください: http://html5doctor.com/html-5-reset-stylesheet/

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。