HTML使用CSS的三种方式
行内样式 直接在html标签中使用style属性,仅在当前标签中有效。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>小黑电脑</title> </head> <body>…
CSS标签选择器
标签选择器 标签选择器只需要写对应的标签名然后在大括号里面写CSS样式代码就可以了,如下代码表示选择当前html中的h1标签,将其文字颜色设置为红色。 h1 { color: red; }
CSS类选择器
类选择器 在类名之前加上一个英文的句号(.)在大括号里面写CSS样式即可。 .red-text { color: red; } 下面代码让p标签和第二个h1标签文字颜色设置为红色,也就是说类选择器可以实现选择不同的标签,只需要设置class属性即可。 <!DOCTYPE html> <html lang="en"> <head> <me…
CSS id选择器
ID选择器 在id属性值前面加#然后在大括号里面写CSS代码即可,由于id在整个html文档中是唯一的,所以它智能选择一个标签而不能像类选择器那样选择多个标签。 #title { color: red; } 如下代码实现了让id值为title的h1标签文字显示为红色。 <!DOCTYPE html> <html lang="en"> <head&g…
CSS基本选择器优先级
CSS基本选择器优先级 id选择器 > 类选择器 > 标签选择器,如下代码中第一个h1标签同时被id选择器、类选择器和标签选择器选中,其文字最终显示为红色,也就是说id选择器中的css代码生效,即其优先级最高。 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu…