如果下一个标签不叫li或者不是指定的选择符
一、行内、内部、外部样式
1、行内样式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body style="background-color: orange;color: red;"> <h1 style="border: 1px solid #ccc;">网页的内容</h1> </body> </html>
2、内部样式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> body { background-color: orange; } h1{ background-color: blue; color: white; } </style> </head> <body> <h1>网页的内容</h1> </body> </html>
3、外部样式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="css/index.css"> </head> <body> <h1>网页的内容</h1> </body> </html>
导入的.css文件
body{ background-color: orange; } h1{ color: red; }
二、语法格局
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> body{ background-color: blue; color: white;} </style> </head> <body> <h1>网页的内容</h1> </body> </html>
三、注释
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> /* 多行注释, 这里的内容就不会被显示或者不会被浏览器执行. */ body{ background-color: #7cffa7; /* 配景-颜色: 蓝色; */ color: white; /* 字体颜色: 白色; */ font-size: 100px; /* 字体-巨细: 100像素; */ } h1{ background-color: white; border-radius: 32px; } </style> </head> <body> <h1>网页的内容</h1> </body> </html>
四、选择符
1、万能选择符
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> body{ background-color: #cccccc; } * { /* 代表网页中的所有元素 */ color: blue; } li{ background-color: wheat; } </style> </head> <body> <h1>静夜诗</h1> <p> 床前明月光,<br> 疑是地上霜.<br> .... </p> <ul> <li>第1个li选项</li> <li>第2个li选项</li> </ul> </body> </html>
2、标签选择符
温馨提示: 本文由Jm博客推荐，转载请保留链接: https://www.jmwww.net/file/web/30997.html
![[转]Node.js中package.json中^和~的区别](/uploads/allimg/200519/054J34453_lit.png "[转]Node.js中package.json中^和~的区别")