02HTML+CSS
今天下午学习了列表,表格和表单。
列表:
列表分为无序列表,有序列表,定义列表。无序列表没有加样式,界面显示出来前面都是一个点,有序列表显示是带有数字1,2,3的列表,而定义列表,可以给出列表的标题和内容。一般来说,我们用到无序列表多,也是重点。
无序列表格式:父标签<ul><li></li></ul>,里面是子标签li,用来放置每一行的内容。
有序列表格式:与无序列表只有一个区别就是把ul换成ol。
定义列表:相对来说麻烦一些,所有东西包裹在<dl></dl>中,在这里面有<dt></dt>里面存放列表的标题,<dd><dd>里面存放内容。
表格:
基本使用:表格的主要格式为<table></table>,在里面有<tr></tr>这个是表格中的每一行,每一行中还有th和td,<th></th>这个是一列的标题,自带这加粗和剧中,<td></td>是表格中具体写内容的地方。table上面可以加属性,border="1"是让表格的边框显示出来,不加则边框不会显现出来。
结构标签:结构标签是给浏览器看到,加上对人的观看没影响,只是电脑更清楚结构。结构标签有<thead>来加到第一行上,表示这是头,<tbody>加到内容上,表示里面都是表格的内容,<tfoot>表示表格的结尾。一般来说是不需要加上这些东西的。
合并单元格:表格中存在相同的数据,我们可以将表格合并,采取原则是保留左上的数据,会在表格中的左或上的数据中加入rowspan="数字",colspan="数字"。然后将重复的表格删掉。数字表示合并几行或几列数据。
表单:
input基本使用:格式为 <input type="类型">,类型有text:文本框,password:密码框,radio:单选框,checkbox:复选框,file:上传文件。
占位文本:input的属性,可以让表单中提示用户干什么,placeholder=“内容”。
单选框:要想实现单选框只能选择一个的功能,需要给input中设置相同的name=“ ”值,才可以,另外加入checked的属性,可以让进入页面时默认选择这个值。
上传多个文件:需要在input属性中加入multiple。
多选框:默认选择的加入属性和单选框相同。
下拉菜单:标签为 <select><option selected>河北</option></select>selectd表示默认选择的菜单值为河北。
文本域:可以让用户输入大片的文字,同时也可以换行,标签为<textarea>
lable标签:可以扩大用户的点击范围,有两种方式,一种直接把表单用lable标签包裹起来,一种是给表单添加一个id值,lable标签有一个相同的for值。就可以实现。
按钮:
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· .NET 使用 DeepSeek R1 开发智能 AI 客户端
· 10亿数据,如何做迁移?
· 推荐几款开源且免费的 .NET MAUI 组件库
· c# 半导体/led行业 晶圆片WaferMap实现 map图实现入门篇
· 清华大学推出第四讲使用 DeepSeek + DeepResearch 让科研像聊天一样简单!