这篇文章主要讲解了“HTML怎么开发单选题页面”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“HTML怎么开发单选题页面”吧!
站在用户的角度思考问题,与客户深入沟通,找到海城网站设计与海城网站推广的解决方案,凭借多年的经验,让设计与互联网技术结合,创造个性化、用户体验好的作品,建站类型包括:网站设计制作、成都网站设计、企业官网、英文网站、手机端网站、网站推广、主机域名、网络空间、企业邮箱。业务覆盖海城地区。
表格
table标签(表格)、
tr标签(行)、
td标签(标准单元格)、
caption标签(标题)、
th标签(表头单元格)。
为了更深一层对表格进行语义化,HTML引入了thead、tbody和tfoot这三个标签。
这三个标签把表格分为三部分:表头、表身、表脚。
table 表格
caption 标题
thead 表头(语义划分)
tbody 表身(语义划分)
tfoot 表尾(语义划分)
tr 行
th 表头单元格
td 表格单元格
姓名语文英语数学
小明808080小红909090小杰100100100平均909090
表格样式美化
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 6px;
color: blue;
}
给表格添加边框,设置字体颜色,
以及给单元格设置一些padding
表单
表单就是收集用户信息的,就是让用户填写的、选择的。
所有的表单内容,都要写在form标签里面
form是英语表单的意思,form中间可以添加文本框、密码框、单选按钮、复选框、下拉列表、按钮、文本域等内容
1.文本框
2.密码框
3.单选按钮男 女
input的type的值如果是radio就是单选按钮。
需要注意的是必须要有相同的name属性,单选按钮才能互斥。
label标签
男
女
input元素要有一个id,然后label标签就有一个for属性,和id相同,就表示绑定了,这个label和input就有绑定关系了。点击label标签中的文字就可以选择相应的单选框
5.4.复选框 睡觉
吃饭
复选框,最好也是有相同的name(便于服务器端收集用户选中的信息)。
5.下拉列表
吃饭
睡觉
打豆豆
select就是“选择”,
select标签和ul、ol、dl一样,都是组标签
option“选项”。
6.文本域
cols属性表示columns“列”,
rows属性表示rows“行”。
值就是数字,表示行数和列数。标签对儿中间的文字是默认出现在文本框的文字,一般不需要写字。
7.按钮
普通按钮
button就是英语“按钮”的意思。value的“值”就是按钮上面显示的文字。
提交按钮
submit就是英语“提交”的意思。这个按钮不需要写value自动就有“提交”文字。这个按钮点击,表单会提交到服务器。
重置按钮
reset就是“复位”“重置”的意思,可以重置前面各个表单元素中填写的值。
只读和禁用
项目实战
制作商品搜索表单
search-form.css.search{
height: 40px;
width: 420px;
margin: 0 auto;
margin-top: 60px;
}
.search .input{
border: 3px solid red;
width: 300px;
height: 36px;
font-size: 20px;
}
.search .btn{
height: 44px;
width: 100px;
border:0;
background-color: red;
color: white;
font-size: 18px;
font-weight: bold;
margin-left: -4px;
vertical-align: top;
letter-spacing: 6px;
}
youlu-search-form.html
Document
感谢各位的阅读,以上就是“HTML怎么开发单选题页面”的内容了,经过本文的学习后,相信大家对HTML怎么开发单选题页面这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是创新互联,小编将为大家推送更多相关知识点的文章,欢迎关注!
当前题目:HTML怎么开发单选题页面
分享路径:https://www.cdcxhl.com/article0/jjgiio.html
成都网站建设公司_创新互联,为您提供小程序开发、微信公众号、、外贸建站、服务器托管、网页设计公司
声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联