1.基本选择器
<style>
div{
font: "微软雅黑";
}
.a{
font-size:80px ;
}
#div5{
font-size:50px ;
color: yellow;
}
</style>
</head>
<body>
<div class="a">w我是中国人</div>
<div id="div5">w我是中国人</div>
<div>w我是中国人</div>
<div>w我是中国人</div>
<div>w我是中国人</div>
</body>
1元素选择器
div{
样式
}
span{
样式
}
class是选择多个div或者span 用.class值获取
id是获取单个div 用#id值获取
2.其他选择器
1.层次选择器
<title></title>
<style>
div p{
color: red;
}
</style>
</head>
<body>
<div >w我是中国人</div>
<div ><p>w我是中国人</p></div>
<div>w我是中国人</div>
<div>w我是中国人</div>
<div>w我是中国人</div>
</body>
div里面的p标签 样式用
div p{
样式
}
2.属性选择器
<title></title>
<style>
input [type='text']{
background-color: red;
}
input [type='password']{
background-color: yellow;
}
</style>
</head>
<body>
<input type="text" name="username"/>
<input type="password" name="password" />
</body>
用属性获取样式
input [type=’text’]{
background-color: red;
}
就近原则
如果
而
引入
可以新建一个css文件存入这些样式 然后用连接起来
这是css文件
<style>
div{
font: "微软雅黑";
}
.a{
font-size:80px ;
}
#div5{
font-size:50px ;
color: yellow;
}
</style>
这是主页面
<title></title>
<link rel="stylesheet" href="1.css" />
</head>
<body>
<div class="a">w我是中国人</div>
<div id="div5">w我是中国人</div>
<div>w我是中国人</div>
<div>w我是中国人</div>
<div>w我是中国人</div>
</body>