首页 > 代码库 > HTML和CSS
HTML和CSS
1.html常用标签：Text，Textarea，Radio，Checkbox，Select，File，Hidden，Submit，Reset，Button
2. 一般说来CSS所有样式有下面的规则(第四个最有优先性)
1). Browser default: 浏览器默认
2). External style sheet: 外部样式表
3). Internal style sheet (inside the <head> tag): 内嵌样式表(在<head>标签内)
4). Inline style (inside an HTML element): 行内样式(在一HTML元素内)
3. CSS的语法由三部分组成：一个选择器，一个属性和一个值。例如：selector {property:value}，body{color:black}
4. 如果值为多个单词则用双引号括起来: p {font-family: "sans serif"}
5. 注意：如果你想指定多个属性，你就必须将每个属性用分号隔开: p {text-align:center;color:red}
6. 你可以将选择器组合。用逗号分隔每个选择器。下的例子将所有的标题元素组合起来，它们的颜色都变为绿色:h1,h2,h3,h4,h5,h6 { color: green }
7. 用选择器类(.className)你可以将同一类型的HTML元素定义出不同的样式。注意：每个HTML元素只能有一个类属性。
8. 类属性定义的时候，可以是:标签名.类名，如：p.right {text-align: right}。
你也可以省略标签名称直接去定义，这样就可以在所有的HTML元素中使用：如：.center {text-align: center}
9. 请不要用以数字开头为名称的类，在Mozilla/Firefox中不能正常运作。
10. 使用id 选择器你可以为不同的HTML元素定义相同的样式。举例：#green {color: green}，p#green {color: green}
11. 和class一样,id的名称的开头也不要使用数字,不然就无法在Mozilla/Firefox中正常运作了
12. CSS注释格式：/* 内容 */
13. 当浏览器阅读样式表，它会依据它（样式表）来格式化文档。有三种方法可以插入样式表:
1). 外部样式表（External Style Sheet ）
2). 内嵌样式表（Internal Style Sheet ）
3). 行内样式（Inline Styles
14. 使用外部样式表是使样式应用于多张网页的理想方法。通过这个方法你只需改动一个文件就能改变整个网站的外观。使用<link>标签让每个页面都连接到样式表。
<link>标签在head区域使用:
<head>
<link rel="stylesheet" type="text/css" href="http://www.mamicode.com/mystyle.css" />
</head>
浏览器将从mystyle.css文件中读取样式定义信息，并依据它来格式化文档
15. 外部样式表可以用任何一个文字编辑器来书写。文件不应该包含任何的html标签。并保存为一个后缀为.css的文件.下面是一个样式表文件的内容:
hr {color: sienna}
p {margin-left: 20px}
16. 注意：请不要在属性值和其单位间加上空格！如：margin-left: 20px
17. 一份内嵌样式表应该在当有单独文档有特殊样式的时候使用。使用<style>标签在head区域内定义样式，像这样：
<head>
<style type="text/css">
hr {color: red}
p {margin-left: 20px}
body {background-image: url("images/back40.gif")}
</style>
</head>
18. 注意：浏览器一般会忽略未知的标签。这就意味着老的浏览器不能支持样式，会忽略<style>标签，但<style>里的内容会显示在页面上。在HTML注释元素中隐藏它可以
来避免这类情况在老的浏览器中发生:
<head>
<style type="text/css">
<!--
hr {color: sienna}
p {margin-left: 20px}
body {background-image:url("images/back40.gif")} -->
</style>
</head>
19. 使用行内样式就失去了样式表的优势而将内容和形式相混淆了。一般这类方法在个别元素需要改变样式的时候使用。在相关的标签上用style属性来加入行内样式。样式属性可以包含
任何CSS属性。例子中将展示怎样给一个段落加上左间距并将颜色改为red：
<p style="color: red; margin-left: 20px"> This is a paragraph </p>
20. 设置CSS样式可以通过：选择器，类属性，ID属性
HTML和CSS