reset.css文件
It took me about a year to feel as though I completely owned cascading style sheets. For a language (yes, it IS a language) with simple syntax, CSS optimization techniques can take quite a while to learn. Formulating your style sheets to do exactly what you want starts with a good foundation, which is why I eventually started using a reset.css file.
我花了大约一年的时间才觉得自己完全拥有级联样式表。 对于具有简单语法的语言(是的,它是一种语言) ,CSS优化技术可能需要花费相当长的时间才能学习。 制定样式表以完全满足您的要求,要有一个良好的基础,这就是为什么我最终开始使用reset.css文件的原因。
Why a reset.css file? Simple -- control. I don't want any formatting on my websites that I didn't specify. Here's my base reset.css file with some quick points following the code:
为什么要使用reset.css文件? 简单-控制。 我不希望网站上没有指定的任何格式。 这是我的基本reset.css文件,其中的一些快速代码如下:
/* all media */
/* global */
* { margin:0; padding:0; }
body { background:#fff; padding:15px 0 30px 0; font:11px arial, helvetica, sans-serif; }
/* tags */
h1 { padding:0 0 15px 0; }
h2 { padding:5px 0 0 0; }
label,select { cursor:pointer; }
li { line-height:15px; margin:5px 0 0 0; }
ol, ul { padding:0 0 10px 35px; }
p { line-height:15px; padding:0 0 10px 0; }
textarea,input { font:11px arial, helvetica, sans-serif; padding:2px; }
/* custom */
.clear { clear:both; }
.input { border:1px solid #ccc; padding:2px; }
.page-break,.print-only { display:none; }
.point { cursor:pointer; }
/* links */
a { color:inherit; }
a:link, a:visited { color:#00f; text-decoration:underline; }
a:hover, a:active { color:#00f; text-decoration:none; }
a img { border:0; }
/* print media */
@media print
{
/* global */
body { color:#000; font-size:9pt; }
/* layout */
#wrap { width:600px; }
/* custom */
.print-only { display:block; }
.page-break { page-break-before:always; }
/* links */
a { text-decoration:underline; color:#999; }
}
全局设置 (Global Settings)
There are some settings that you can set globally so you might as well do so. Be wary, however, of what you put in the "*" setting as opposed "body" setting. For example, setting the font-size property in the '*' selector will change the font-size of the '<b>' tag -- you will only want the bold tag to change the font-weight to bold, not change the font size. Place the global font-size in the <body> tag.
您可以全局设置一些设置,因此也可以这样做。 但是,请注意在“ *”设置中放置的内容而不是在“ body”设置中放置的内容。 例如,在'*'选择器中设置font-size属性将更改'<b>'标签的字体大小-您只希望粗体标签将font-weight更改为粗体,而不更改字体大小。 将全局字体大小放在<body>标记中。
没有保证金和填充 (No Margin & Padding)
Microsoft Internet Explorer and Firefox use a very different set of rules for margin and padding and I'd much rather not take the chance that margin look different in either browser.
Microsoft Internet Explorer和Firefox在边距和填充方面使用了非常不同的规则集,我宁愿不要冒险在两种浏览器中使用边距看起来都不同。
一起丝网印刷 (Screen & Print Together)
Putting my basic print needs in the reset.css file saves a request to the server, no good reason besides that.
将我的基本打印需求放入reset.css文件中,可以将请求保存到服务器,除此之外,没有充分的理由。
What are your thoughts? Do you use a reset.css file? What differs between your CSS and mine?
你觉得呢?你有没有什么想法? 您是否使用reset.css文件? 您CSS和我CSS有什么不同?
reset.css文件