HTML css——表单元素

最新推荐文章于 2024-07-08 17:28:27 发布
最新推荐文章于 2024-07-08 17:28:27 发布
阅读量563 收藏
点赞数
分类专栏： 前端入门学习 文章标签： html css 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/coising/article/details/122638782
版权

表单元素

文章目录


一系列元素 主要用于搜集用户数据

input元素

输入框
type属性：输入框类型
type：text 普通文本输入框
type：password 将输入的内容换成字符
type：data 日期选择框 兼容性问题
type：search 搜索框，兼容性问题
type：range 滑块 选中的数字由js读取
type:color 颜色选择

静态页面 尽量用button

value属性：输入框的值
placeholder属性：显示提示的文本，文本框没有内容提示

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <p>
        <!-- 普通文本输入框 -->
        <input type="text" placeholder="请输入账号">
    </p>
    <p>
        <!-- 数字输入框 -->
        <input type="number" min="5" step="2">
    </p>
    <p>
        <!-- 多选框 -->
        <input type="checkbox" >
        音乐
        <input type="checkbox" >
        电影
    </p>
    <p>
        <!--单选框  取名name在一组-->
        <input name="gender" type="radio">
        nan
        <input name="gender" type="radio">
        女
    </p>
    <p>
        <input type="file">
    </p>
    <p>
        <input type="reset" value="Reset">
    </p>
    <p>
        <input type="button" value="按钮">
    </p>
    <p>
        <input type="submit" value="提交按钮">
    </p>
</body>
</html>

默认选中 checked

select元素

下拉列表选择框
通常和option元素配合使用

<!DOCTYPE html>
<html lang
最低0.47元/天 解锁文章
33的史努比
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
css表单元素
weixin_42380289的博客
01-28 301
表单元素 一系列元素，主要用于收集用户数据 input元素 输入框 type属性：输入框类型 type: text， 普通文本输入框 type：password，密码框 type: date, 日期选择框，兼容性问题 type: search, 搜索框，兼容性问题 type: number，数字输入框 type: checkbox，多选框 type: radio，单选框 value属性：输入...
HTML 表单元素
摆渡人
01-15 162
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <!-- 表单的作用：收集信息 --> <title>表单</title> </head> <body> <!-- action：决定谁处理它-- > &l...
CSS之表单元素
weixin_33810302的博客
12-25 126
 表单就是收集用户信息的，就是让用户填写的、选择的。 1                &lt;div&gt; 2                         &lt;h3&gt;欢迎注册本网站&lt;/h3&gt; 3                         &lt;form&gt; 4                                 所有的表单内容，都要写在...
表单基础元素及CSS基础
qq_45275992的博客
11-22 122
1、表单作用 2、表单中的基础元素 3、CSS简介 4、CSS语法 5、样式的创建 6、两种引入外部样式表的区别 7、样式表的优先级和作用域 8、CSS选择器 9、选择器的权重 10、浮动属性的简单应用 11、HTML、CSS注释
HTML 表单元素的基本样式
歪脖先生的博客
02-22 5718
表单元素的样式CSS 表单元素主要包括 label、input、textarea、select、datalist、keygen、progress、meter、output等，以及对表单元素进行分组的 fieldset 和 legend 元素。根据功能的不同，input 元素又包括 text、password、radio、checkbod、file、submit、reset、search、tel、u...
css-表单元素
止水Itachi
03-10 166
表单元素： action="提交地址" method="提交方式" get post input type="radio" 单选按钮 注意: 同一组的name属性值必须一致,才可以达到互斥的效果 checked="checked"默认选中 type="checkbox" 多选框 注意: name值不需要一致 ...
HTML表单元素
Ryan的博客
11-11 590
HTML表单元素 HTML中的表单元素，可以说是整个HTML中最常用也是最重要的部分，里面包含的太多的元素，尔每一个元素中的type类型又有很多种。所以需要大家理清楚区分开来。 第一个当然是我们最常见的 input；其type值超多： <input type="text"> 定义供文本输入的单行输入字段 <input type="password"> 定义密码字段 <input type="submit"> 定义提交表单数据至表单处理程序的按钮。 <input ty
HTML+CSS大作业——vivo官方商城
07-08
【HTML+CSS大作业——vivo官方商城】这个项目是一个基于HTML和CSS技术构建的模拟vivo官方网站的页面设计。这个任务旨在让学生掌握基础的网页布局、元素样式控制以及响应式设计等关键技能。 HTML（HyperText Markup ...
HTML标记语言——表单
09-28
这种方法传统上很常见，因为它提供了一种直观的方式来排列表单元素，通常将描述性的标签放在左边，输入字段放在右边。例如，表单可以包含一对`<tr>`（表格行）和`<th>`（表头）来定义标签，而`<td>`（表格数据单元格...
HTML+CSS购物网站——小米有品
03-23
购物车页面则会有商品列表、数量调整、总价计算等功能，这需要使用表格（`<table>`）、列表（`<ul>`、`<li>`）以及表单（`<form>`）等元素。个人信息页可能会包含用户头像、昵称、联系方式等，而登录和注册页面则会...
标记语言——短语元素
12-10
上文：标记语言——表单 原文出处 Chapter 6 ,与其他短语元素 在引言和前面的章节中,已经稍微提到过语义标签的概念,使用标签为文件标识意义,而不是单纯的以标签设定显示效果.设计完全使用语义标签的网页是个不错的...
HTML+CSS静态京东界面
03-09
此外，`<a>`标签用于创建链接，`<img>`用于插入图片，`<input>`则用于表单元素，如搜索框。 接着，CSS（Cascading Style Sheets）用于美化HTML元素的外观。在`css`目录下，可能包含一个或多个`.css`文件，这些文件...
CSS表单元素样式设置
机器人视觉感知
04-17 2345
（1）表单由两部分组成，访问者在页面上可看见并填写的控件、标签和按钮的集合，以及用于获取信息并将其转化为可以读取或计算的的格式的处理脚本。 （2）表单创建，以form标签开始结束，开始和结束form标签之间是组成表单的标签，控件和按钮。form开始标签最重要的两个属性值，action和method。action属性的值设为访问者提交表单时服务器上对数据进行处理的脚本的URL，method属性值要么...
CSS优化表单元素样式
Terisadeng的博客
05-04 875
&lt;%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%&gt; &lt;% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+r
05_css特性及html列表、表单、表格元素
qq_45131163的博客
07-21 257
一、css特性 1、继承 一个元素如果有设置某属性的值，就使用自己设置的值（不论是网页设置的，或者父元素设置的） 一个元素如果没有设置某属性的值，就会跟随父元素的值 img{ /*width: 100%*/ /*百分比相对于包含其的版块*/ width: inherit; /*with不支持继承，可查阅文档mdn，inherit强制继承 */ } 不能继承的属性，一般可以使用inherit值强制继承父元素的值 继承注意点： css属性继承的是计算值，并不是当初编写属性是的
html5常见的表单元素
mockingbirds的专栏
09-17 2234
在html5当中新增了很多的表单元素属性，这些属性使得我们开发人员在开发移动应用的时候更快，更方便。常用的表单属性form属性<form id="formtest" action="formServlet" method="post"> <input type="text" name="name"> <input type="submit" value="submit
Web前端知识CSS（HTML表单、表单元素、表单属性、表单控件）
m0_72686827的博客
08-15 651
能够说出表单组成部分掌握HTML常用表单元素掌握HTML常用表单属性表单的作用：用于搜集不同类型的用户输入表单的组成：表单元素（控件）、表单区域生活中的表单：网页中的表单：表单：采集不同类型用户输入的数据，然后发送给服务器，实现用户与服务器之间的数据交互一个完整的表单包含：表单域，表单控件（表单元素），提示信息，共三个部分；语法： <form></form> 作用：定义 HTML 表单域，是一个包含表单元素的区域。实现用户信息的收集和传递。举例说明：比如最为常见的交互操作，
HTML实现图片查看与隐藏
最新发布
你羡慕的生活都是你没熬过的苦。
07-08 501
你好呀，我是小邹。在网页设计中，提供一个直观且用户友好的图片查看功能是提升用户体验的重要一环。本文将详细介绍如何使用HTML、CSS和JavaScript来实现图片的查看与隐藏功能。通过本教程，你将学会如何让页面上的图片在点击时放大显示，以及如何通过再次点击或点击背景来关闭放大的图片。
2022.最新H5全栈面试题.pdf
11-04
- 验证码用于防止自动机器人提交表单，解决安全性问题。 9. 标准模式与兼容模式： - Doctype声明决定了浏览器以何种模式解析页面，标准模式严格遵循W3C规范，兼容模式则向后兼容旧的渲染方式。 10. CSS相关： -...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值