参考CSS模板
如果我知道正在干着的网站会有大块大块的CSS来袭,我喜欢使用下面这个有几分类似飞机起飞前检查清单的模板,它确保我可以顾及所有基本的选择器。假使一个页面的不同区域的同一组选择器(比如无序列表)要使用不同的样式,我只需拷贝粘贴,并加上恰当的id和class。没有用到的话,我只需删掉。以下是CSS模板1的样例:/* ----- IDS ----- */#container{} #primaryContent{} #secondaryContent{} #navigation{} #footer{}/* ----- CLASSES ----- */.hide{}.show{}/* ----- HEADINGS ----- */h1{}h2{}h3{}h4{}/* ----- LISTS ----- */ li{}li p{}ol{}ul{}ol li{}ul li{}/* ----- IMAGES ----- */img{}img a{}img a:hover{}/* ----- LINKS ----- */a{}a:hover{}a:visited, a:active, a:focus{}a:visited{}a:active{}a:focus{}/* ----- FORMS ----- */form{}fieldset{}legend{}label{}input{}textarea{}input, textarea{}select{}optgroup{}option{}/* ----- TABLES ----- */table{}caption{}thead{}tbo***{}tfoot{}tr{}tr .alt{}th{}td{}CSS模板2你知道什么遥不可及吗?记住并且填入所有CSS选择器恰当的性质(property,又译特性,属性)。留意我大部分的项目,我一遍又一遍地为选择器使用相同的性质。所以我创建另外一个基于CSS模板1的模板,在里面为所有CSS选择器添加经常会用的CSS性质。以下是CSS模板2的样例:/* ----- CSS ----- */*{margin:;padding:;font-family:;font-size:;}bo***{margin:;padding:;background:;}/* ----- IDS ----- */#container{width:;margin:;padding:;background:;text-align:;}#primaryContent{position:;float:;width:;margin:;padding:;background:;text-align:;}/* ----- CLASSES ----- */.hide{display:none;} .show{display:block;}/* ----- PARAGRAPHS ----- */p{font:;color:;font-size:;font-family:;font-style:;font-weight:;font-variant:;text-align:;text-indent:;text-decoration:;text-shadow:;text-transform:;letter-spacing:;word-spacing:;}/* ----- LISTS ----- */li{listy-style:;list-style-type:;list-style-image:;list-style-position:;float:;margin:;padding:;}/* ----- LINKS ----- */a{font:;color:;text-decoration:;border-bottom:;}a:hover{color:;background-color:;border-bottom:;}a:visited, a:active, a:focus{color:;background-color:;border-bottom:;}
转载请注明原文地址: https://ibbs.8miu.com/read-17471.html