学习CSS的第5天

最新推荐文章于 2022-04-21 12:48:50 发布

donner25

最新推荐文章于 2022-04-21 12:48:50 发布

阅读量112

点赞数

文章标签： css

本文链接：https://blog.csdn.net/donner25/article/details/113272305

版权

H5新增input表单、表单属性（12分钟视频学习）

属性	值	描述
required	required	必填
placeholder	placeholder	占位符，如下图灰色的字
autofocus	autofocus	自动定位光标
autocomplete	on/off	自动填充/不填充
multiple	multiple	可以多选文件提交

案例如下

<head>
    <meta charest="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA -Compatible" content="ie-edge">
    <title>Document</title>
</head>

<body>
    <form action="">
        用户名： <input type="text" required="required" placeholder="请输入用户名" autofocus="autofocus" name=username autocomplete="on"><input type="submit" value="提交"> 
        上传头像： <input type=file name="" id="" multiple="multiple">
    </form>

</body>

在这里插入图片描述

CSS3属性选择器（11分钟视频学习）

标签选择器权重是1
属性选择器、类选择器、伪类选择器权重均为10
属性选择器=标签[属性]，如：button[diasbled]

案例如下

<head>
    <meta charest="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA -Compatible" content="ie-edge">
    <title>Document</title>
</head>
<style>
    button {
        cursor: pointer;
    }
    
    button[disabled] {
        cursor: default;
    }
</style>

<body>
    <button>按钮</button>
    <button>按钮</button>
    <button disabled="disabled">按钮</button>
    <button>按钮</button>

</body>