html5前端学习2

一篇思维题题解:

第五周任务 [Cloned] - Virtual Judge (vjudge.net)

http://t.csdn.cn/SIHdM

快捷键:

Ctrl+Alt+Down        向下选取

Ctrl+Alt+Up             向上选取(会出现多个光标,可以同时输入)

Ctrl+Enter                无论光标在哪个位置,都向下换行,与Enter有区别

 

超链接标签

链接分类

外部链接:例如 <a href="http://www.baidu.com">百度</a>

内部链接:网站内部页面之间的相互链接,直接链接内部页面名称即可,例如< a href="index.html"> 首页</a>

空链接:如果当时没有确定链接目标时,<a href="#"> 首页</a>

下载链接:如果href里面的地址是一个文件或者压缩包,会下载这个文件

网页元素链接:在当前文件中的各种网页元素,如文本,图表,表格,音频,视频等都可以添加超链接。

锚点链接:点击链接,可以快速定位到页面中的摸个位置。

  • 在链接文本的属性中,设置属性值为 #名字 的形式,如<a href="#two">第二集</a>
  • 找到目标位置的标签,在里面添加一个id属性=名字,如<h3 id="two">第二集介绍</h3>

注释标签和特殊字符

注释

如果需要在HTML文档中添加一些便于阅读和理解的注释文字,需要用到注释标签:

<!--注释内容
-->

快捷键:Ctrl+/

特殊字符 

在HTML中,通常多个空格通常会被合并成一个空格,还有其他特殊字符,特殊字符的使用会使得前端代码更加灵活、简洁,提高了开发效率。

caf526af390c4c6cbd31a84e881b676f.png

表单

<input>表单元素

button                定义可点击按钮

checkbox           定义复选框

file                     定义输入自读和“浏览”按钮,供文件上传

hidden               定义隐藏的字段

image                定义图像形式的提交按钮

password          定义密码字段

radio                  定义单选按钮

reset                  定义重置按钮,重置按钮会清除表单中的所有数据

submit               定义提交按钮,提交按钮会把表单数据发送到服务端

text                    定义单行的输入字段,用户可在其中输入文本,默认宽度为20个字符

<form><!-- text 文本框 用户可以在里面输入任何文字 -->用户名:<input type="text" maxlength="6" value="用户名" name="name"><br><!-- password 密码框 用户看不见输入的密码 -->密码:<input type="password" name="pwd"><br><!-- radio 单选按钮 可以实现多选 --><!-- name是表单的名字,这里性别多选按钮必须有相同的名字name,才可以实现多选一 --><!-- 单选按钮和复选框可以设置checked属性,当页面打开的时候可以默认选中这个按钮 -->性别:女<input type="radio" name="name" value="女" checked="checked">男<input type ="radio" name="name" value="男"><br><!-- checkbox 单选按钮 可以实现多选 -->爱好:吃饭<input type ="checkbox" name="hobby">睡觉 <input type ="checkbox" name=""hobby>打豆豆<input type ="checkbox" name="hobby"><br><!-- 点击提交按钮,可以把表单域form里面的元素 里面的值 提交给后台 --><input type="submit" value="免费注册"><!-- 重置按钮可以还原表单元素的初识默认状态 --><input type="reset" value="重新填写"><!-- 普通按钮 button 后期结合js 搭配使用 不会提交信息--><input type="button" value="获取短信验证码"><!-- 文件域 上传文件时使用 -->上传头像:<input type="file"></form>

label标签

为input元素定义标签。

<label>标签用于绑定一个表单元素,当点击<label>标签内的文本是,浏览器就会自动将光标转到对应的表单元素上,用来增加用户体验。

    <label for="nan">男</label>

    <input type="radio" name="sex" id="nan">

    <label for="nv">女</label>

    <input type="radio" name="sex" id="nv">

select下拉表单

在页面中,如果用多个选项让用户选择,并且想节约页面空间时,可以使用<select>标签控制

    <select><option>山东</option><option>北京</option><option selected="selected">天津</option></select>

<select>中至少要包含一对<option>

在<option>中定义selected="selected"使,当前项即为默认选中项。

textarea表单元素

当用户输入内容较多的情况下,不能使用文本框表单了,此时可以使用<textaera>标签。

常用于多行文本输入控件,可以输入更多的文字,该控件常用于留言板,评论。

    <from>今日反馈:<textarea>hello,world!</textarea></from>

属性:clos=“每行中的字符数”,rows=“显示的行数”。(在实际开发中不会使用,是通过CSS来改变大小)

 

 

 

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

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

相关文章

24个Jvm面试题总结及答案

1.什么是Java虚拟机&#xff1f;为什么Java被称作是“平台无关的编程语言”&#xff1f; Java虚拟机是一个可以执行Java字节码的虚拟机进程。Java源文件被编译成能被Java虚拟机执行的字节码文件。 Java被设计成允许应用程序可以运行在任意的平台&#xff0c;而不需要程序员为每…

html实现多种风格的时间轴(附源码)

文章目录 1.设计来源1.1 对称风格时间轴1.2 横向风格时间轴1.3 回忆风格时间轴1.4 记事风格时间轴1.5 简易风格时间轴1.6 科技风格时间轴1.7 列表风格时间轴1.8 跑道风格时间轴1.9 人物风格时间轴1.10 容器风格时间轴1.11 沙滩风格时间轴1.12 双边风格时间轴1.13 图文风格时间轴…

基于原生 js 实现今日新闻网站

完整资料进入【数字空间】查看——baidu搜索"writebug" 一、今日新闻网站设计报告 1.1 1 设计思路 该网站设计大部分都是基于原生 js 实现。基本思想为首先将基本的页面架构包括 header&#xff0c;导航条写好。之后根据后台 PHP 请求接口请求返回 JSON 格式数据后…

【Linux 系统编程】Linux背景介绍 及 基本指令详解(一)

文章目录 1. Linux背景1.1 发展史1.2 开源精神1.3 官网1.4 企业应用现状1.5 发行版本1.6 os概念&#xff0c;定位 2. Linux下基本指令2.1 几个常用基本命令演示2.2 某些概念的解释2.3 ls 指令2.4 pwd 指令2.5 cd 指令Linux的目录结构绝对路径与相对路径cd 常用快捷命令 2.6 tou…

30_小驰私房菜_qcom根据关键日志信息,快速排查问题

根据关键日志信息,能帮忙我们快速的定位和分析问题。是一项必须得掌握的技能。 一、查看当前是哪个app调用的相机 logcat 关键字“CameraService::connect” 如下面日志打印所示,我们还可以看到是调用的Camera API 1还是Camera API 2. 二、查看配流情况 1) qcom 平台 …

一套A股量化系统

shares A 股量化交易系统后台开发语言 Go/Python gmsec算法使用&#xff1a;pytorch全链路量化&#xff0c;行业板块分析&#xff0c;直接贴图。欢迎体验

12 | 领域建模:如何用事件风暴构建领域模型?

目录 事件风暴需要准备些什么&#xff1f; 1. 事件风暴的参与者 2. 事件风暴要准备的材料 3. 事件风暴的场地什么样的场地适合做事件风暴呢&#xff1f; 4. 事件风暴分析的关注点 如何用事件风暴构建领域模型&#xff1f; 1. 产品愿景 2. 业务场景分析 3. 领域建模 4…

HashSet、LinkedHashSet、TreeSet有什么区别

- HashSet、LinkedHashSet 和 TreeSet 都是 Set接口的实现类&#xff0c;都能保证元素唯一&#xff0c;并且都不是线程安全的。HashSet 的底层数据结构是哈希表&#xff08;基于 HashMap 实现&#xff09;&#xff0c;元素存入和取出顺序不一致。LinkedHashSet 的底层数据结构…

Java Servlet 技术

一、Servlet 简介 Servlet 是 JavaEE 的规范之一&#xff0c;通俗的来说就是 Java 接口&#xff0c;将来我们可以定义 Java 类来实现这个接口&#xff0c;并由 Web 服务器运行 Servlet &#xff0c;所以 TomCat 又被称作 Servlet 容器。 Servlet 提供了动态 Web 资源开发技术…

Leetcode-每日一题【206.反转链表】

题目 给你单链表的头节点 head &#xff0c;请你反转链表&#xff0c;并返回反转后的链表。 示例 1&#xff1a; 输入&#xff1a;head [1,2,3,4,5]输出&#xff1a;[5,4,3,2,1] 示例 2&#xff1a; 输入&#xff1a;head [1,2] 输出&#xff1a;[2,1] 示例 3&#xff1a; 输…

矩阵压缩算法

当矩阵中存在着重复元素时&#xff0c;为了节省空间会采用压缩算法&#xff0c;关键在于原矩阵空间与压缩后数据结构的对应&#xff1b; 1.对称压缩&#xff1a;数据沿对角线对称的情况&#xff1b; 将矩阵压缩为一维数组&#xff0c;数组的长度是&#xff1a; 对于num[n][n…

计算机网络之链路层和局域网

六.链路层和局域网 6.1 链路层概述 6.1.1 链路层可能提供的服务 成帧、链路接入、可靠交付、差错检测和纠正 6.1.2 链路层在何处实现 下图是一个典型的主机体系结构&#xff0c;链路层的主体部分是在网络适配器实现的&#xff0c;部分链路层是在运行于主机CPU上的软件实现的…