从0开始学前端第一天

学习内容:

acwing web应用课

1、各种标签

2、MDN网站,用来搜各种标签的含义

3、CTRL+/ 快速注释

表单:

<form>标签
HTML <form> 元素表示文档中的一个区域,此区域包含交互控件,用于向 Web 服务器提交信息。

<input>标签
HTML <input>用来填写内容,常见类型有:

<input type="text">:创建基础的单行文本框。
<input type="number">:用于让用户输入一个数字。其包括内置验证以拒绝非数字输入。浏览器可能会选择提供步进箭头,让用户可以使用鼠标增加和减少输入的值,或者只需用指尖敲击即可。
<input type="email">:带有 “email” (电子邮箱) 类型标记的输入框元素 (<input>) 能够让用户输入或编辑一个电子邮箱地址,此外,如果指定了multiple属性,用户还可以输入多个电子邮箱地址。在表单提交前,输入框会自动验证输入值是否是一个或多个合法的电子邮箱地址 (非空值且符合电子邮箱地址格式). CSS 伪标签 :valid 和 :invalid 能够在校验后自动应用。
<input type="password">:<input> 元素 里有一种叫做 “password” 的值,给我们一个方法让用户更加安全的输入密码。这个元素是作为一行纯文本编辑器控件呈现的,其中文本被遮蔽以致于无法读取,通常通过用诸如星号(“*”)或点(“•”)等符号替换每个字符来实现。这个符号会根据用户的浏览器和操作系统来具体显示哪个。
<input type="radio">:<input> 的 radio 类型元素默认渲染为小型圆圈图表,填充即为激活,类似于之前描述额复选框(checkbox)类型。单选按钮允许你选择单一的值来提交表单。
常用属性有:

name: 名称
id: 唯一ID
maxlength:最大长度
minlength:最小长度
required:是否必填
placeholder:当表单控件为空时,控件中显示的内容
<textarea>标签
HTML <textarea> 元素表示一个多行纯文本编辑控件,当你希望用户输入一段相当长的、不限格式的文本,例如评论或反馈表单中的一段意见时,这很有用。

<select>与<option>标签
HTML <select> 元素表示一个提供选项菜单的控件。

示例:

<label for="pet-select">Choose a pet:</label>

<select name="pets" id="pet-select">
    <option value="">--Please choose an option--</option>
    <option value="dog">Dog</option>
    <option value="cat">Cat</option>
    <option value="hamster">Hamster</option>
    <option value="parrot">Parrot</option>
    <option value="spider">Spider</option>
    <option value="goldfish">Goldfish</option>
</select>
<button>标签
HTML <button> 元素表示一个可点击的按钮,可以用在表单或文档其它需要使用简单标准按钮的地方。 默认情况下,HTML 按钮的显示样式接近于 user agent 所在的宿主系统平台(用户操作系统)的按钮, 但你可以使用 CSS 来改变按钮的样貌。

遇到的问题:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/624152.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Windows 应用不能正常启动 (The application was unable to start correctly (0xc000007b))

文章目录 小结问题及解决参考 小结 最近碰到了Windows应用不能正常启动 (The application was unable to start correctly (0xc000007b))的问题&#xff0c;进行了解决。 问题及解决 点击应用后&#xff0c;应用直接不能启动&#xff0c;返回(The application was unable to…

C语言经典算法之简单选择排序算法

目录 前言 建议&#xff1a; 简介&#xff1a; 一、代码实现 二、时空复杂度&#xff1a; 时间复杂度&#xff1a; 空间复杂度&#xff1a; 三、算法的特性&#xff1a; 四、总结 前言 建议&#xff1a; 1.学习算法最重要的是理解算法的每一步&#xff0c;而不是记住…

MySQl导入与导出远程备份

文章目录 一. navicat导入导出 二. mysqldump命令导入导出导入导出 三. load data infile命令导入导出导入导出 四. 远程备份导入导出思维导图 一. navicat 导入 右键——>运行SQL文件 导出 选中要导出的表➡右键➡转储SQL文件➡数据和结构 二. mysqldump命令导入导出…

Oracle全系列版本官网下载保姆及教程

Oracle全系列版本官网下载方法 下面以下载Oracle12cR2为例说明下载的整个过程。 基本步骤如下&#xff1a; 先注册一个Oracle账号并登录&#xff1b;进入到客户下载页面搜索要下载的数据库版本&#xff1b;得到Oracle下载器(Oracle_SSN_DML_xxxxx.exe)&#xff0c;注意&#xf…

智慧公厕:颠覆传统公共厕所管理的未来之路

公共卫生设施一直是城市管理中的重要环节&#xff0c;而智慧公厕作为一种全新的公用卫生设施&#xff0c;以其融合了物联网、大数据、云计算等新型信息技术的特点&#xff0c;引起了人们的广泛关注。通过智能化手段的管理和服务&#xff0c;智慧公厕不仅解决了传统公厕中存在的…

【Flask 连接数据库,使用Flask-Migrate实现数据库迁移及问题汇总】

Flask 连接数据库&#xff0c;使用Flask-Migrate实现数据库迁移 安装Flask-Migrate插件 pip listall Flask-Migrate# 安装失败使用以下方式安装 pip install –i https://pypi.tuna.tsinghua.edu.cn/simple flask-migrate使用Flask-Migrate步骤 app.py主要用于数据库连接 f…

微机原理常考填空以及注意事项

以下&#xff1a; 1&#xff0c;两条高位地址线未参加地址译码&#xff0c;则对应的地址范围它的容量是多少倍&#xff1f; 答&#xff1a;公式CPU的地址线&#xff08;假设16位&#xff09;&#xff08;它的低位地址线一般进入片内A0~A10&#xff0c;高位A11就是A、A12就是B、…

DNS

目录 一、名字解析介绍和DNS 1.1.什么是DNS 1.2.域名体系结构 1.3.DNS查询方式 1.4.DNS解析过程 1.5.DNS服务器类型 二、安装配置 2.1.DNS软件bind 2.2.修改权限 和 监听地址 2.3.手写域名配置文件 2.4.手写数据库配置文件 2.5检测文件格式的命令 一、名字解析介绍和…

TreeSet指定排序规则

TreeSet集合如果要对添加的元素进行排序&#xff0c;则添加的元素所属的类要实现Comparable接口&#xff08;基本类型的包装类&#xff0c;String类都文现了该接口&#xff09;&#xff0c;Comparable接口的compareTo&#xff08;&#xff09;方法内会用自然比较方法对元素排序…

【OpenCV学习笔记12】- 更改颜色空间

关于 OpenCV 官方文档的核心操作告一段落&#xff0c;接下来开始图像处理的学习。学习笔记中会记录官方给出的例子&#xff0c;也会给出自己根据官方的例子完成的更改代码&#xff0c;同样彩蛋的实现也会结合多个知识点一起实现一些小功能&#xff0c;来帮助我们对学会的知识点…

【数学建模美赛M奖速成系列】数据可视化(二)

数据可视化&#xff08;二&#xff09; 写在前面百分比堆叠线条图优点缺点实现pythonmatlab 火山图优点实现pythonmatlab 最后 写在前面 上一篇文章为大家分享了山脊图和气泡图的绘图方法与代码&#xff0c;这里学姐为继续为大家分享百分比堆叠线条图和火山图&#xff0c;包含…

Gd-DOTA-SH钆-大环配体的结构特点 | 星戈瑞

Gd-DOTA-SH钆-大环配体是一种具有特殊结构特点的化合物。(来自星戈瑞的科研试剂) Gd-DOTA-SH这个化合物的名称可以分解为三个部分。首先&#xff0c;"Gd"代表该化合物中含有钆元素&#xff08;Gadolinium&#xff09;。其次&#xff0c;"DOTA"代表四聚乙二…

R语言【文章复现】——集成式地绘制高分辨率的多样性分布图,对方法的检验和优化,以及处理思路的思考

参考文献 本文对一篇 2022 年发表在 New Phytologist 的绘图方法文章中的技术路线进行复现。 An integrated high-resolution mapping shows congruent biodiversity patterns of Fagales and Pinales Summary 文中,作者针对在全球尺度上绘制物种分布图提出了一种全新的方法…

华为网络设备 通过路由器子接口 Dot1q终结子接口实现跨VLAN通信

(二层交换机直接跳过三层交换价接入路由器时才使用该配置。推荐使用三层交换机建立VLANIF配置更简洁明了。如果VLAN较少可直接配置&#xff1b;路由器接口&#xff0c;一个物理接口一个VLAN) S1配置 vlan batch 2 to 3interface GigabitEthernet0/0/1port link-type trunkpor…

项目人力资源管理

1计划&#xff1a;规划人力资源管理 3执行&#xff1a;组建项目团队&#xff0c;建设项目团队&#xff0c;管理项目团队 1、规划人力资源管理 确定角色&#xff0c;职责及回报关系&#xff0c;编制人员配备管理计划 需要经常性复查&#xff0c;立即修正。 需要有备选人员。…

为什么代码里需要try/catch

throw 语句用来抛出一个用户自定义的异常,在抛出错误时&#xff0c;throw 之后的语句将不会执行 const getApi (data) > {if (isNaN(data)) {throw new Error(Parameter is not a number!);console.log(bar) // 这句永远不会执行&#xff0c;throw之后的代码都不会}}情况一…

[Python练习]使用Python爬虫爬取豆瓣top250的电影的页面源码

1.安装requests第三方库 在终端中输入以下代码&#xff08;直接在cmd命令提示符中&#xff0c;不需要打开Python&#xff09; pip install requests -i https://pypi.douban.com/simple/ 从豆瓣网提供的镜像网站下载requests第三方库 pip install requests 是从国外网站下…

喜报 ,思迈特荣获广东省“专精特新”企业认定,再创新高

近日&#xff0c;广东省工业和信息化厅发布 2023年专精特新中小企业名单&#xff0c;思迈特软件凭借专业技术实力、创新研发能力、行业影响力以及卓越的企业文化&#xff0c;经过层层选拔&#xff0c;荣获广东省“专精特新”企业认定。思迈特商业智能与大数据分析软件成功上架&…

数据库:园林题库软件(《城市绿地设计规范》答题卷三 )

《城市绿地设计规范》答题卷三 填空题 1、动物笼舍、温室等特种园林建筑设计&#xff0c;必须满足动物和植物的生态习性要求&#xff0c;同时还应满足游人观赏视觉和人身安全要求&#xff0c;并满足管理人员人身安全及操作方便的要求。 2、市绿地内的建筑应充分考虑雨水径流…

智能制造工业互联网建设方案——青创智通工业物联网

智能制造已经成为工业发展的重要趋势。智能制造系统架构与工业物联网建设方案作为实现智能制造的关键环节&#xff0c;对于推动工业转型升级和提升企业竞争力具有重要意义。青创智通工业物联网重点探讨智能制造系统架构与工业物联网建设方案的核心要素、实施步骤和未来发展方向…