html2day(合并单元格,有序、无序列表,input、select、textarea表单)

合并单元格步骤:

1.确定是跨行还是跨列合并
2.找到目标单元格(即合并的第一格),写上合并方式=合并的单元格数量,比如:<td colspan=“2”></td>
3.删除多余的单元格(即被合并的单元格)。否则表格紊乱。请添加图片描述
示例如上图。

表格(table)是用来显示数据的,那么列表就是用来布局的。

三大列表:有序、无序、自定义列表

无序列表(unordered list):

ul只能嵌套li(列表项目),li(list item)相当于一个容器,可以容纳所有元素。

请添加图片描述

有序列表(ordered list):

除了有序,和有序列表没有区别
ol里面嵌套li。
请添加图片描述

自定义列表(ordered list):

dlDefinition List(定义列表):用于定义描述列表。
dtDefinition Term(定义术语):定义项目/名字。
ddDefinition Description(定义描述):描述一个项目/名字。
基本语法:

    <dl>
        <dt>水果</dt>
        <dd>西瓜</dd>
        <dd>草莓</dd>
    </dl>

请添加图片描述
后面运用CSS可以做成下面的样子
请添加图片描述

表单的组成:

请添加图片描述
表单域:包含表单元素的区域(就是form标签
<form>标签用于定义表单域,以实现用户信息的收集和传递给服务器。

    <form action="url地址" method="提交方式 get/post" name="表单域名称(用以区分同一页面的多个表单域)">
        各种表单元素控件
    </form>

表单标签

**

input(单标签):

**
<input type="text">:文本输入框。
<input type="password">:显示***,密码输入框。
<input type="checkbox">:复选框,默认是小方格,可以选择多个。
<input type="radio">:单选框,默认是小圆圈,只能选择一个(通过设置相同的name属性来实现)。
input 除type外的其他属性

属性属性值描述
namename=“控件的名称”定义input元素的名称,主要是用来区分其他的控件(相当于起名字)
sizesize=“控件的长度”表示文本框在页面里能够显示出来的长度(就是你能看见文本框里面有多少个字符)
maxlengthmaxlength=“最长的字符数”表示文本框里面最多可以输入的字符数
valuevalue=“自定义值”用于定义input元素的值(在其他如radio的type中设置不会显示在页面,但后台会接受这个值)
checkedvalue=“checked”主要针对单选按钮和复选框,打开页面就默认选中某个表单元素(例:默认选中同意注册条款的复选框)
        <!-- submit 提交按钮可以把表单域form里面的表单元素 里面的值 提交给服务器 -->
        <input type="submit" value="免费注册"></br>
        <!--reset 重置按钮还原表单元素初始的默认状态 -->
        <input type="reset" value="重置按钮"> </br>
        <!-- button 普通按钮 button 后期结合JS搭配使用 -->
        <input type="button" value="获取短信验证码"></br>
        <!-- file 文件域  使用场景:上传文件使用的 -->
        上传头像:<input type="file" > </br>

在这里插入图片描述

label标签:

label标签 用户绑定一个input表单元素,当点击label标签内的文本时,浏览器会自动将光标转到对应的表单元素上。增加用户体验
核心:

 <label for="boy"></label> <input type="radio" name="sex" value="" id="boy">	
 <label for="girl"></label> <input type="radio" name="sex" value="" id="girl">  </br>

在这里插入图片描述

select标签:

多个选项的下拉列表,节约页面空间。

       <h4>下面是下拉表单</h4>
        籍贯:
        <select name="address" id="">
            <option value="江西">江西</option>
            <option value="广东">广东</option>
            <option value="深圳" selected="selected">深圳</option>
            <option value="景德镇">景德镇</option>
        </select>

在这里插入图片描述

  1. select中至少包含一对option
  2. option中的selected属性可以设置默认选中项目。selected="selected"

textarea标签:

    <h4>下面是文本域</h4>
    <textarea name="" id="" cols="1" rows="10">文本内容</textarea>

实际开发中不会使用,都是用CSS来改变你大小

综合案例:

已完成。没什么问题(我承诺那里不是自定义列表,先用个h4再用个ul即可)请添加图片描述

html结束了(虽然只是一些入门的知识点)。CSSgo

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值