css基础
一.引入css的三种方式:
1.内联属性(Inline style attribute)的使用方法是,对于想要设置样式的HTML元素,直接修改他的style属性,将css代码直接写在style属性里。
比如:
<html> <body> <h1 style="font-size: 12px;">我的字号被修改了</h1> </body> </html>
2.直接写在style标签里.
例:
<html> <head> <style> h1 {font-size: 12px;} </style> </head> <body> <h1>我的字号被修改了</h1> </body> </html>
3.使用link标签引入外部css文件(一般写在head标签里面).如:<link rel="stylesheet" href="styles.css" />
根据自己的需要,设置相应的属性.
二.语法规则由两个主要的部分构成:SS选择器(selector),以及一条或多条声明(declaration).
1.selector {declaration1; declaration2; ... declarationN }
选择器标明了我们要操作的HTML元素。 每个声明用分号隔开,最后一个声明不用。
而每一个声明由一个属性名和一个值组成。属性名和值被冒号分开。
如下:selector(选择器) {property(属性): value(值)}
2.元素选择器就是以HTML标签(又叫HTML元素)作为目标的选择器。 这种选择器的目的,是改变某类元素的默认样式。
例如:div{ color:red}.
则<div>与</div>之间的元素都有div里面的属性,如果要里面的元素都有属性则 [标签名 里面标签名{}.]
3.类选择器(Class Selector)是一种独立于HTML元素来指定样式的选择器.
例子:.warning{ color:red;} <h1 class="warning">我是警告标题</h1>.
通过class属性,将这个类与html元素关联在一起.类选择器还可以与其他选择器搭配使用h1.warning{color: red;}这样就只有hi里面的color样式改成了red.
4.通配选择器:*.warning{ color: red;}这样的类选择器适用于所有元素。除了最开始没有用到的地方。
5.ID选择器:前面加一个#,一般不写*.
例:#warning-title {font-weight: bold;} <h1 id="warning-title">这是一个警告标题</h1>.
相关推荐
background-color: blue;background-color: yellow;<input type="button" value="变蓝" @click="changeColorT