html练习1之表格练习和注册页面练习-爱代码爱编程

代码这种东西，不是看了就会了，需要自己练习，多写就会熟练。

刚复习完了html，现在记录一下练习。

练习列子的来源

https://how2j.cn/k/html/html-practise2/641.html?p=134657

练习一 表格练习

记录一下自己的盲点

1. 合并表格

横向合并 <td colspan="2">

纵向合并 <td rowspan="2">

2. 块元素&内联元素

所有的html元素，都要么是block(块元素)、要么是inline(内联元素)。

block元素的特点：

总是在新行上开始；
高度，行高以及顶和底边距都可控制；
宽度缺省是它的容器的100%，除非设定一个宽度。<h1>.<p>, <ul> <table>

inline元素的特点：
和其他元素都在一行上；
高，行高及顶和底边距不可改变；
宽度就是它的文字或图片的宽度，不可改变。

<b>, <td>, <a>, <img>

3. div&span

HTML <div> 元素是块级元素，它是可用于组合其他 HTML 元素的容器。

<div> 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。

如果与 CSS 一同使用，<div> 元素可用于对大的内容块设置样式属性。

<div> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 <table> 元素进行文档布局不是表格的正确用法。<table> 元素的作用是显示表格化的数据。

HTML <div> 元素是块级元素，它是可用于组合其他 HTML 元素的容器。

<div> 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。

如果与 CSS 一同使用，<div> 元素可用于对大的内容块设置样式属性。

div 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 table 元素进行文档布局不是表格的正确用法。table 元素的作用是显示表格化的数据。

练习二 注册页面

1. 表单

form

但是重点来了！！！！！！

表单会排列的很不整洁

所以可以运用的是table，把所有的东西当作table元素放进去，可以格式统一！

2. 文本框&密码框&重置&提交

<input type="text/password/reset/submit" name="name">

3. 下拉列表

<select>

​            <option>男</option>

​            <option>女</option>

​        </select>

4. 按钮

button type=“”

<button></button>即按钮标签
与<input type="button">不同的是，<button>标签功能更为丰富

按钮标签里的内容可以是文字也可以是图像

如果button的type=“submit” ，那么它就具备提交form的功能