h5c3

最新推荐文章于 2022-11-20 22:50:43 发布

VIP文章 ℡清欢

最新推荐文章于 2022-11-20 22:50:43 发布

阅读量300

点赞数

本文链接：https://blog.csdn.net/weixin_44695219/article/details/89889186

版权

语义化标签:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--如果浏览器的版本小于ie9， 浏览器会读取以下代码-->

    <!--[if lt IE 9]>
    <script src="js/html5shiv.min.js"></script>
    <![endif]-->

    <style>
        header {
            width: 200px;
            height: 200px;
            background-color: pink;
        }
        fieldset{
            width:400px;
        }
    </style>

</head>
<body>
<div></div>
<!--块级标签-->
<header>头部标签</header>

<nav>导航标签</nav>

<section>块级标签</section>
<footer>
    脚部标签
</footer>

<select name="" id="">
    <option value="篮球">篮球</option>
    <option value="足球">足球</option>
    <option value="羽毛球">羽毛球</option>
</select>

<input type="text">
<input type="text" placeholder="占位信息" list="week">
<datalist id="week">
    <option value="星期一">星期一</option>
    <option value="星期二">星期二</option>
    <option value="星期三">星期三</option>
</datalist>

<fieldset>
    <legend>注册信息</legend>
    用户名：<input type="text"> <br>
    密码：<input type="password">
</fieldset>

</body>
</html>

新增的input type属性值:

类型****	使用示例****	含义****
email****	<input type="email">	输入邮箱格式
tel****	<input type="tel">	输入手机号码格式
url****	<input type="url">	输入url格式
number****	<input type="number">	输入数字格式
search****	<input type="search">	搜索框（体现语义化）
range****	<input type="range">	自由拖动滑块
time****	<input type="time">	小时分钟
date****	<input type="date">	年月日
datetime****	<input type="datetime">	时间
month****	<input type="month">	月年
week****	<input type="week">	星期年

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        .box {
            width: 600px;
            margin: 0 auto;
            border: 1px solid #ccc;
        }

        .box dl {
            margin: 15px 0;
            overflow:hidden;

最低0.47元/天解锁文章

℡清欢

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
h5c3

语义化标签:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title>  <!--[if lt I...
复制链接

扫一扫