详解：18:in-range :out-of-range

最新推荐文章于 2021-12-20 19:37:37 发布

贵哥的编程之路(热爱分享)

最新推荐文章于 2021-12-20 19:37:37 发布

阅读量549

点赞数 1

分类专栏： CSS3最详解

本文链接：https://blog.csdn.net/qq_37805832/article/details/105763745

版权

CSS3最详解专栏收录该内容

54 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        input[type="number"]:in-range
        {
            border: 1px solid red;
        }
        input[type="number"]:out-of-range
        {
            border: 1px solid yellow;
        }
    </style>
</head>
<body>
    <form>
        用户名:<input type="text" name="username" id="" placeholder="请输入" required="required" ><br>
        密码:<input type="password" name="password" id="" required="required" placeholder="你输入"><br>
        邮箱:<input type="text" name="email" id="" required="required"  placeholder="请输入"><br>
        年龄:<input type="text" name="age" id="" placeholder="输入"><br>
        性别:<input type="radio" name="sex" id="" value="1">男
        <input type="radio" name="sex" id="" value="2">女
        <input type="radio" name="sex" id="" value="3" checked="checked">保密<br>
        兴趣爱好:
        <input type="checkbox" name="fav[]" id="" value="1" checked="checked" />PHP
        <input type="checkbox" name="fav[]" id="" value="2" checked="checked" />PHP
        <br>    
        <input type="email" placeholder="2306613258@qq.com">
        年龄<input type="number" min="1" max="3" value="1">
        <input type="submit" name="" value="reg">
    </form>
</body>
</html>

问题：怎么显示input[type=“number”]:out-of-range
{
border: 1px solid yellow;
}呢
?在里面填写即可，不要按在这里插入图片描述

贵哥的编程之路(热爱分享)

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
1
评论
详解：18:in-range :out-of-range

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style type="text/css"> input[type="number"]:in-range ...
复制链接

扫一扫