css好学么?

html-css012

css好学么?,第1张

好学啊,我感觉css就是死记硬背,当然也不是真的死记硬背,但最起码的理解大概是什么效果还是必要的,真的遇到问题查也有个查的方向。

当然常用的也不用你刻意去记,所谓的熟能生巧,你用得多了自然就刻进你的记忆了。

好久以前喜欢网络编程,这样说吧css(cascading style sheet)就是分层次(称之cascading)地显示定义网页格式(称之style), sheet的意思可以理解为这个网页格式本身style.css吧呵呵,css是作用于html标签上的所以要学css你还必须知道html,我知道这样解释对刚学这太抽象了所以干脆直接推荐个网址给你:http://www.w3schools.com你先在上面看看最基本的html,css之类的知识, 然后可系统地看下Eric Meyer的CSS权威指南(经典CSS书,网上和国内大书店都有英文原版可买), 看完此书css你就该出师了呵呵,不过单纯的css或html或其它什么语言是没什么意义的,语言之间都是融汇贯通,精其一必知所有,而知所有未必精一门,当爱好来学吧会让你的生活多些乐趣,而若想成高手道路漫漫呵呵~~

再给你发几个相关css的链接也当自己汇集到这里备份,你不用先理会,先按上面从w3schools.com了解最基本的再看css the definitive guide系统下最后可网络淘金了:

http://blog.html.it/layoutgala/

http://www.barelyfitz.com/screencast/html-training/css/positioning/

http://www.cleancss.com/

http://snook.ca/archives/html_and_css/six_keys_to_understanding_css_layouts/?

http://www.smashingmagazine.com/2008/02/21/powerful-css-techniques-for-effective-coding/

http://www.dustindiaz.com/css-shorthand/

有问题随时问我,乐意竭力帮助!

关于一些简单的代码你试下从这个在线css编辑网页:

http://www.w3schools.com/css/tryit.asp?filename=trycss_default

你试试将左侧的文字CSS example!改成faysea, This is a paragraph.改成happy valentine's day你就会在右侧的显示框中看到我给你的祝福呢:-)))

基本说明下你从网页右侧看到的代码<h1>CSS example!</h1>和<p>This is a paragraph.</p>其中<h1>和<p>是html标签(tags),通俗说h1 就是heading字体1号大小了,p就是paragraph文字放在其中啦,在上面的(专业说法就是html头文件了呵呵)<head></head>之间嵌入了css来 定义下面的html的<h1>和<p>的样式(style),诸如字体大小,颜色,显示在网页的位置等等,也就是你看到的位于<style type="text/css">和</style>之间的部分,你细心留意下在这个css样式定义中,h1的颜色是orange橙色,文字排列是center中间,所以你在右侧看到的显示就是位于页面中间位置的橙色文字了,其具体代码是这样的:

h1{

color:orange

text-align:center

}

假如你把orange改成pink(情人节嘛!)把center改成left右侧显示的效果就不一样了,其实css就这样简单3个英文组合:tags, property, value。 tags基本就是html的标签所以必须了解,每个标签都有其属性(property)比如你是漂亮,可爱的啦之类的,而value就是其范围程度了,拿你为例写个小的mock css script可以这样:

you

{

prettiness:very-very-much

happiness:valentinesday-and-everyday

}

当然这个是不能运行的,是情人节独自一人博你开心的呵呵!

不难学的。但是如果方法错了,走弯路就会觉得很麻烦的感觉,特别是css。一般是先在W3School( http://www.w3school.com.cn/ )上学的,先看看基础教程,然后点击网站上的“亲自试一试”链接,进行进一步学习。想说的是虽然DreamWeaver点一点就能出效果,但是建议还是手动敲一敲,要记的并不多,常用的更少。如果直接用DreamWeaver学,很容易出现不知所以然的情况。看完完整的教程后,平常登录别人网站的时候,按F12借助浏览器调试工具(现在大部分浏览器都有这个功能了,火狐、chrome、IE8/9、360极速浏览器、搜狗浏览器...),看看别人写的html结构和css,隐藏和显示某些css语句,感受效果;或者自己添加和修改一下css语句,看看效果(随便怎么改,网站刷新后还是恢复原样,所以不怕改坏..)。建议学习的时候用火狐浏览器(安装插件firebug后更方便)或chrome浏览器,因为在修改css的时候会更加方便。如果打开360浏览器或搜狗浏览器的时候按F12没能调出调试工具的话,那应该是浏览器的模式是IE6/IE7,这时候得看看浏览器能不能调一下浏览模式..关于调试工具的使用:方法一:按F12调出来,调试工具的最左侧(一般在左侧)有个箭头按钮,点击后再点击你想查看的元素,就可以同时看到这个元素的html以及它所应用到的css。(如果某条css上有删除线,那只是被其他css覆盖了,并不是这条css出错,如果css出错,浏览器是不会读出来的。)方法二:鼠标右键选中“审查元素”或“查看元素”,但是这个选项在IE(IE内核的浏览器)是没有的。但是这种方法是可以直接定位到你想查看的元素的。完成了以上以后,可以看书《CSS权威指南(第三版)》再巩固一下知识~(别忘了边看边敲一敲..)