在HTML文件的头部添加
<link href="style.css" rel="stylesheet">
在css中添加使得网页的内容全部变为居中显示
- body {
- text-align: center;
- }
<body style="text-align: center">
- <style>
- body {
- text-align: center;
- }
- style>
可以快速选择页面中所有指定的的标签并使用此样式显示
样式编写完成后,如果只有一个属性,可以不带`;`若多个属性则每个属性后面都需要添加一个`;`
`input`标签
标签名称 {
属性名称: 属性值
}
- input {
- width: 200px;
- font-size: 20px;
- line-height: 40px;
- }
每个元素的id是唯一,可以通过id选择器快速地去设置某个元素样式
选择某个id需要在前面加上一个`#`
<h1 id="title">登陆我们的网站h1>
- #title {
- color: red;
- }
每个元素都可以有一个`class`属性,表示当前元素属于某个类(注意这里的类和我们Java中的类概念完全不同)一个元素可以属于很多个类,一个类也可以被很多个元素使用
- <form>
- <div >
- <label class="test">
- 账号:
- <input type="text" placeholder="Username...">
- label>
- div>
- <div>
- <label class="test">
- 密码:
- <input type="password" placeholder="Password...">
- label>
- div>
- form>
- .test{
- color: blue;
- }
可以让多个选择器,共用一个css样式
.test, #title {
color: red;
}
* {
color: red;
}
div label {
color: red;
}
一般:
内部样式>id选择器>类选择器>元素选择器
在属性后面添加`!important`标记,表示此属性是一个重要属性,它的优先级会被置为最高