1、CSS介绍
css是英文Cascading Style Sheets 的缩写，称为层叠样式表，用于对页面进行美化。
存在方式有三种：元素内联、页面嵌入和外部引入，比较三种方式的优缺点。
语法：style='background-color:red;height:100px'
在标签中使用 <div style='background-color:red;height:100px' > </div>
在页面中嵌入 <style type='text/css'> </style> 块
引入外部CSS文件 <link rel='stylesheet' href='common.css' />
2、标签选择器
example:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>页面一</title>
<!-- 引用外部的CSS文件-->
<link rel='stylesheet' href='common.css' />
<style>
<!-- class等于logo的标签引用这个样式-->
.logo{
background-color:red;font-size:18px;border:1px sold
#fff;
}
<!-- class等于logo的标签下面的A标签引用这个样式-->
.logo a{
background-color:purple;font-size:18px;border:1px sold
#fff;
}
<!--ID等于gjlin就引用这个样式 -->
#gjlin{
background-color:#616130;font-size:18px;border:1px sold #fff;
}
<!--所有H1标签引用这个样式 -->
h1{
background-color:blue;
}
<!--所有的a和div标签引用这个样式 -->
a,div {
color:yellow;
}
<!--A下面的DIV标签引用这个样式 -->
a div {
background-color:pink;font-size:18px;border:1px sold #fff;
}
<!--input标签的属性类型为password的标签引用这个样式 -->
input[type='password']{
background-color:yellow;
}
<!-- -->
input[type='text']{
background-color:#BEBEBE;
}
</style>
</head>
<body>
<div class='logo' >class等于logo的标签引用这个样式</div>
<p class='logo'>
<a>class等于logo的标签下面的A标签引用这个样式</a>
</p>
<div id='gjlin'>ID等于gjlin就引用这个样式</div>
<h1>所有H1标签引用这个样式</h1>
<a>
<div>A下面的DIV标签引用这个样式</div>
</a>
<input type='text'/>
<br/>
<input type='password'/>
</body>
</html>
