Rumah > Artikel > hujung hadapan web > HTML5新增加的标签和表单新增属性的代码实例
1.以前的盒子都有 标签,现在都用语义化的标签,例如:
代码如下:
<header>头部</header> <nav>导航</nav> <section> <aside>左侧栏</aside> <article>文章</article> </section> <footer>页脚</footer>
添加样式:
header,nav,section,footer{ width: 1300px; height: 50px; border: solid #08050a 1px; /*margin:auto;*/ margin-bottom: 5px;} aside,article{ border: solid red 1px; height: 100%; margin:0;} aside{ float: left; width:30%;} article{ float:left; width: 60%;}
效果如下:
2.表单新增的三个属性:
Required:自动check内容
autofocus:自动获取焦点(页眉一打开就获取到焦点,而不是将光标移动到上面才获取到)
placeholder:默认显示内容
代码如下:
<form action="post"> 用户名:<input type="text" name="username" required="required" placeholder="请输入用户名" autofocus="autofocus"> <br> <input type="submit" name="submit" value="提交"> </form>
运行效果:
点击提交按钮后:
Atas ialah kandungan terperinci HTML5新增加的标签和表单新增属性的代码实例. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!