CSS 初期化設定
- 投稿日 : 2007-05-27, 16:08
- 最終更新日時 : 2012-07-04 02:04:13（履歴）
- タグ（CSS / Templates / BackUp）
- カテゴリ（Design）
- 記し人（luvsic）[PDF]
- 閲覧数（1965）
ブラウザによって見た目が変わる事、それに付随するコーディング作業を減らすためのCSS初期化設定。もちろん俺専用かつFuckin' validate.
随時ブラッシュアップ用。
@charset "utf-8";
/*===============================================*/
/* CSS for myselfArchiver */
/* https://luvsic.net/ */
/* (c) Luvsic All Rights Reserved. */
/* written by Luvsic 2011,05-09 (YYYY-MM-DD) */
/* */
/*===============================================*/
/*
Reset
-------------------------------*/
html, body, div, span, applet, object, embed, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
outline: 0;
border: none;
font-size: 100%;
font-style: normal;
font-weight: normal;
background: transparent;
vertical-align: baseline;
}
html {
height: 100%;
overflow-y: scroll;
}
body {
line-height: 1.6;
font-size: 13px;
*font-size: 81.25%;/* for IE6,IE7 */
font-family: "Lucida Grande", "Verdana", "Meiryo", "メイリオ", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "MS PGothic", "ＭＳ Ｐゴシック" sans-serif;
}
h1,h2,h3,h4,h5,h6 {
font-weight: normal;
font-family: "Meiryo", "メイリオ", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "MS PGothic", "ＭＳ Ｐゴシック" monospace;
}
a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;text-shadow: 0 0 1px #999;}
a:active {text-decoration:none;}
a:focus {outline: 0;}
a[href = ""] { background: red; color: white; }
p {
line-height: 2em;
}
strong, em {
font-weight: bold;
}
blockquote p {
padding: 0.5em;
}
blockquote p.cite{
text-align: right;
background-color: #f0f0e8;
}
blockquote, q {
quotes: none;
}
q:before, q:after {
content:'';
}
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
img {
vertical-align: bottom;
background-color: #090;
color: #fff;
}
br {
letter-spacing: 0;
}
pre {
font-family: "Osaka-Mono", "Osaka－等幅", "MS Gothic", "ＭＳ ゴシック", arial, 'Lucida Grande', monospace;
line-height: 1.4;
letter-spacing: 0;
white-space: pre; /* CSS 2.0 */
white-space: pre-wrap; /* CSS 2.1 */
white-space: pre-line; /* CSS 3.0 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
white-space: -moz-pre-wrap; /* Mozilla */
white-space: -hp-pre-wrap; /* HP Printers */
word-wrap: break-word; /* IE 5+ */
}
hr {
margin: 0;
padding: 0;
border: 0;
color: #000;
background-color: #000;
height: 1px;
}
/* テーブル系 */
table {
border-collapse: collapse;
border-spacing: 0;
}
caption, th {
text-align: left;
}
th, td {
vertical-align: top;
}
/* リスト系 */
ol, ul {
list-style: none;
list-style-position: inside;
}
ol {
list-style-type: decimal;
}
ol li {
zoom: normal;
}
/* ボタン系 */
input[type="text"], input[type="password"], textarea, select {
border-width: 1px;
border-style: solid;
border-color: #ddd;
font-size: 93%;
color: #333;
background-color: #fff;
}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
border-width: 1px;
border-style: solid;
border-color: #6ddeff;
font-size: 93%;
color: #333;
background-color: #fff;
}
button, input[type="button"], input[type="submit"], input[type="reset"] {
padding: 3px 0.7em 1px;
margin: 0;
}
form label, button, input[type="button"], input[type="submit"], input[type="reset"], select {
cursor: hand;
cursor: pointer;
}
input[disabled][readonly] {
background-color:#CCC;
}
optgroup {}
/*
CSS Tricks
-------------------------------*/
.hideText {
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
/* 簡易ロールオーバー */
a:hover.rollover img {
opacity: 0.7; /* Standard: FF gt 1.5, Opera, Safari */
filter: alpha(opacity=70); /* IE lt 8 */
-ms-filter: "alpha(opacity=70)"; /* IE 8 */
-khtml-opacity: 0.7; /* Safari 1.x */
-moz-opacity: 0.7; /* FF lt 1.5, Netscape */
}
/* new clearfix */
.clearfix:after {visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;}
* html .clearfix { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
No comments yet