<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CCS 选择器 上机练习1</title>
<style>
#list {
width: 200px
font-size: 12px
background: #ccc
}
#list .title {
color: #ff7300
font-size: 14px
}
</style>
</head>
<body>
<div id="list">
<ul>
<li class="title">家用百货</li>
<li>大家电</li>
<li>洗衣机</li>
<li>电冰箱</li>
<li>平板电脑</li>
</ul>
<ul>
<li class="title">日用百货</li>
<li>肥皂</li>
<li>洗衣粉</li>
<li>纸巾</li>
<li>洗发水</li>
</ul>
</div>
</body>
</html>
题外话:
1.将来不想失业就别作弊,这个太基础了。
2.你的代码缩进太非主流了,这是态度问题。我是老板一定不要你,是老师一定体罚你。
3.出题的人不专业啊,这里用自定义列表才更语义化,附代码:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CCS 选择器 上机练习1</title>
<style type="text/css">
* {
padding: 0
margin: 0
}
#list {
padding: 10px 15px
background: #ccc
font-size: 12px
width: 200px
}
#list dt {
font-size: 14px
color: #ff7300
margin: 5px 0
}
</style>
</head>
<body>
<dl id="list">
<dt>家用百货</dt>
<dd>大家电</dd>
<dd>洗衣机</dd>
<dd>电冰箱</dd>
<dd>平板电脑</dd>
<dt>日用百货</dt>
<dd>肥皂</dd>
<dd>洗衣粉</dd>
<dd>纸巾</dd>
<dd>洗发水</dd>
</dl>
</body>
</html>
许多人都开始学习CSS,但又不知从何入手,所以此文就是给那些初学者所写,带他们踏上CSS列车。 一. CSS学习重在方法! 学习任何东西都是一样,从小学、中学、大学,除了学习知识外就是去学习方法! 要想掌握CSS, 首先要学会HTML,因为一个样式它是不可能脱离HTML页面的,HTML不与样式结合的话, CSS就失去了存在的意义。所以一般书中都会举一个例子,然后让你上机测试效果,这是笔者想让你有对样式表CSS有一个初步的印象,告诉你CSS能做什么。一个小例子:“麻雀虽小,五脏俱全”,你可能看不懂每一个语句的真正意思。但是你可以记得例子的模式,以后在实践中不断地用,不断用的过程就是不断记的过程,所以不能恢心,不能总认为自己记忆力不好,但不管你骑的是牛也好,千里马也罢,只要有恒心,一定会到达终点的。 阅读一本书,一般来说第一次要先把整个书通读一遍,不理解的也要往下看,在往下看的过程中你也许会找到那个问题的答案。看完后你有一个大概的印象,但一定有很多不明白的地方,没关系,继续往下看。 第二遍你就要边看边做学习笔记了,把你认为是重点的部分写上,还有,你觉得有疑问的部分也要记下,带着疑问看下去,如果没有答案,你可以去BBS上发一个贴子,好心人还是很多的,提示一句:“一定要学会如何去问问题!” 这里就不说了。你还要上机去练习书上的例子,最让你困惑的:“一是记不住,二是对概念的理解有误(这一条可能是书译的不好,另外就是你的理解不对)”,对于第一条你就要树立信心,坚持再坚持下去。当你到达终点时你回发现一切都是顺理成章的事。因为你努力了,努力了就会有回报,有结果。 有好多人也看了,但是没有什么进步,分析主要有以下几个原因: 原因一:压力不够,因为有不少人比如美工学CSS,因为是看别人学,所以学之,不学就没优势!这样的压力是很小的,学不好还有美工这碗饭。 原因二:只是业余学习,这样学还只是玩一玩,因为你不一定非要以这门技术吃饭。 原因三:方法不对,有的人只是在看教程,但他不动手去做,我以前就是看的太多,做的太少,所以有了实践你才能把理论的东西揉进去。 二. 掌握CSS的四个学习阶段 学CSS可以分成以下几个阶段: 阶段一:不去想浏览器的兼容性问题的情况下能做出页面,但页面里到处用TABLE的 模式DIV写出的页面。 阶段二:想到了兼容性问题,但无法提前预防,只会修补问题,大量使用HACK技术(我对HACK技术只是知道,但用的很少) 阶段三:可提前预防BUG,但样式表中大量应用了ID,CLASS,CSS译过来是重叠样式表,比如“DIV P SPAN”。这句代码是标明DIV子元素中P的子元素SPAN,这样写就可以定义SPAN的样式了,不用在SPAN中加入CLASS了。这也就是CSS的优点所在,为什么不好好利用而一定要定义一个CLASS呢! 阶段四:这一阶段是最难的,良好的HTML语义结构、合理的CSS、可重复利用的样式。