仔细学习CSS（一）

推荐编辑器：Notepad (under Windows), TextEdit (on the Mac) or KEdit (under KDE)；

Style Master, Dreamweaver or GoLive

For HTML and CSS, we want simple, plain text files.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
DOCTYPE means DOCument TYPE
Between <head> and </head> there is room for various kinds of information that is not shown on screen.
<body>里的就是用来显示的了~

'2em' means 2 times the size of the current font.

什么是CSS及使用的好处：

cascading Style Sheet：层叠样式表

控制网页样式、能将样式信息与网页内容分离的、一种标记性语言。

不需要编译，由浏览器执行。为浏览器解释型语言。

作用于：页面布局、字体、颜色、背景、特效等。

相关组织和历史：

1994提出、1996年浏览器支持、W3C（world wide web consortium）的CSS组。

1996、CSS1；

1998、CSS2；目前是CSS2.1；

CSS3 已经开始应用了~

可用于多种设备：手机、电视、打印机、幻灯片等。

比传统HTML的优势（内容老啦，可忽视）：控制、排版（对应：html的标记）；

　　提高网页浏览速度：table全加载完显示？css加载点显示点？

　　可维护性、易维护性、SEO等。

CSS基本语法：

　　a{font-size:12px;font-family:"Microsoft Yahei";display:inline-block;}　

　　.last{}/*类选择符*/

　　#last{}　/*ID选择符，局限性很大。我个人不喜欢在html结构中使用id。*/

　　H1, H2, H3 { font-style: bold }/*合并多个selector*/

　　CSS1 定义了50种。　　CSS2 在CSS1的基础上增加了70种，定义了大概120种属性。

HTML里使用CSS的方式，一般四种：

1. 直接写在标签里。

<span style="display:block;height:20px;">我不喜欢这样写。不建议。</span>

2. 在header头里加一段css代码。

　　li{list-style-type:none;}　

</style>

3. 在header头引入一个css文件。一般都用这种方式。

4. @import 引入。

浏览器和CSS：

　　兼容性问题；

是否支持CSS。<style type="text/css"></style>（现在）| （过去）

　　<style type="text/css"></style> 告知浏览器引入文件的类型，支持也读文件，不支持忽视之。

树结构与继承:

　　子节点通用样式可以放在父节点写，（代码重构）样式预设；

　　也增加了可读性。（书写规范）

重写：

　　能够重写是因为：更具有指向性。更具体。

　　　　　　　　　　与顺序无关！？

不是所有的属性都可继承！

　　比方说：background...

　　你在body上写个background，再看它的子节点，你会发现。。

　　why？

　　　　There are two reasons: first, transparent backgrounds are faster to display (there is nothing to display!) than other backgrounds.

　　　　元素背景默认为 transparent。

　　　　Second, since background images are aligned relative to the element they belong to, you would otherwise not always end up with a smooth background surface.

　　Tips：如果background 属性存在时，记得增设一个 color 值。确保文字和背景不一致~？

问题：需要研究下CSS的继承性~对于每个属性的继承性~

转载于:https://www.cnblogs.com/hanyuxinting/p/4092722.html

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/420482.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！