CSS 选择器（Selector）学习及相关在线测试网站

黑麋鹿

2023-04-09 2023-04-09 约 384 字预计阅读 1 分钟

Click the CSS Selectors and see the specified element(s) get selected. 单击左边列出的CSS选择器表达式，对应被选择的元素（集）会高亮显示。

菜鸟教程网的css选择测试工具，可以在左上角输入html源码，右上角输入css定位语法及其相应字体颜色等来查看定位到的元素。 https://c.runoob.com/front-end/61/
在Chrome的开发者工具检查元素选项卡中，按Ctrl+F显示的输入框中直接输入css语法可定位到元素。

CSS语法说明:https://www.runoob.com/cssref/css-selectors.html

最最方便的方法，在html文件同目录新建css文件abc.css，同时在html的head标签中引用该css文件，然后开启html的live preview，边在abc.css文件中编写，边观察html的预览效果，引用abc.css文件方法：

1
2
3


<head>
    <link rel="stylesheet" href="详情.css">
</head>

目录