CSS笔记 id选择器和通配符选择器

最新推荐文章于 2024-06-19 15:19:49 发布

yogur_father

最新推荐文章于 2024-06-19 15:19:49 发布

阅读量395

点赞数

分类专栏：入门学习文章标签： css

本文链接：https://blog.csdn.net/yogur_father/article/details/109361073

版权

入门学习专栏收录该内容

156 篇文章 3 订阅

订阅专栏

一.id选择器

#id名 {
 	属性
}

在标签中属性一栏填写id = “id名

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> 表格 </title>
    <style>
        #blue {
            color:blue;
        }
    </style>
</head>
<body>
    <form>
        <label for="name" id="blue">用户名：</label>                
        <input type = "text" name="username" value="请输入用户名" maxlength="6" id="name">         <br/>

        <label for="man">男</label>
        <input type="radio" id="man" name="sex">
        <label for="woman">女</label>
        <input type="radio" id="woman" name="sex">

    </form>
</body>
</html>

在这里插入图片描述

注：这个id只能调用一次

二.通配符选择器

* {
	属性；
}

把所有的标签都进行改变

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> 表格 </title>
    <style>
        #blue {
            color:blue;
        }

        * {
            color: red;
        }
    </style>
</head>
<body>
    <form>
        <label for="name" id="blue">用户名：</label>                
        <input type = "text" name="username" value="请输入用户名" maxlength="6" id="name">         <br/>

        <label for="man">男</label>
        <input type="radio" id="man" name="sex">
        <label for="woman">女</label>
        <input type="radio" id="woman" name="sex">

    </form>
</body>
</html>