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来改变大小)

 

 

 

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【Java】Java核心 78:Git 教程(1)Git 概述

文章目录 01.GIT概述目标内容小结 02.GIT相关概念目标内容小结 01.GIT概述 Git是一个分布式版本控制系统&#xff0c;常用于协同开发和版本管理的工具。它可以跟踪文件的修改、记录历史版本&#xff0c;并支持多人协同工作。通过Git&#xff0c;你可以轻松地创建和切换分支、合…

去除小程序home按钮

前言&#xff1a;当我们未登录时&#xff0c;会跳转到登录页&#xff0c;但是这时候登录页左上角会有一个跳转到首页的按钮&#xff0c;但是&#xff0c;我们不希望出现这个回到首页的按钮 去除前&#xff1a; 去除后&#xff1a; 代码&#xff1a; onShow() {wx.hideHomeBut…

从零搭建一台基于ROS的自动驾驶车-----2.运动控制

系列文章目录 北科天绘 16线3维激光雷达开发教程 基于Rplidar二维雷达使用Hector_SLAM算法在ROS中建图 Nvidia Jetson Nano学习笔记–串口通信 Nvidia Jetson Nano学习笔记–使用C语言实现GPIO 输入输出 Autolabor ROS机器人教程 从零搭建一台基于ROS的自动驾驶车-----1.整体介…

VS2022 And QtCreator10 调试 Qt 源码教程

文章目录 背景IDE 调试 Qt 源码Visual Studio 2022Qt Creator 10.0.1 排查思路姊妹篇系列 简 述&#xff1a; 记录使用 Visual Studo 2022 和 QtCreator10 调试 Qt 5.15 源码和 加载 .pdb 的方法。 本文初发于 “偕臧的小站”&#xff0c;同步转载于此。 背景 源码&#xff1a;…

AR项目问题汇总

1、unity使用URP 导致ARFoundation黑屏 (16条消息) unity使用URP 导致ARFoundation黑屏_arfoundation运行iphone黑屏_weixin_46813963的博客-CSDN博客https://blog.csdn.net/weixin_46813963/article/details/117509322Configuring the AR Camera background using a Scriptab…

当RPA遇到ChatGPT, 有哪些好玩的玩法

实在RPA于2023年4月7日发布了 6.7.0 SP3&#xff0c;其中最引人注目的亮点是与ChatGPT的紧密集成 。这种集成为用户提供了全新的玩法和体验&#xff0c;使他们能够与智能模型进行即时对话和交互&#xff0c;从而提高工作效率和创造力。用户可以将ChatGPT作为虚拟助手&#xff0…

java设计模式(二十三)访问者模式

目录 定义模式结构角色职责代码实现适用场景优缺点定义 访问者模式是一种行为型模式,它允许你定义一个作用于某个对象结构中的各个元素的操作,而同时又不改变这些元素的类。该模式的核心思想是将数据结构与数据操作分离,从而可以在不改变数据结构的前提下定义新的操作。 模…

《计算机系统与网络安全》 第十章 防火墙技术

&#x1f337;&#x1f341; 博主 libin9iOak带您 Go to New World.✨&#x1f341; &#x1f984; 个人主页——libin9iOak的博客&#x1f390; &#x1f433; 《面试题大全》 文章图文并茂&#x1f995;生动形象&#x1f996;简单易学&#xff01;欢迎大家来踩踩~&#x1f33…

MySQL日志详解

♥️作者&#xff1a;小刘在C站 ♥️个人主页&#xff1a; 小刘主页 ♥️努力不一定有回报&#xff0c;但一定会有收获加油&#xff01;一起努力&#xff0c;共赴美好人生&#xff01; ♥️学习两年总结出的运维经验&#xff0c;以及思科模拟器全套网络实验教程。专栏&#xf…

Shell脚本编程教程

Shell脚本编程 1.Shell脚本语言的基本结构 1.1 Shell脚本的用途&#xff1a; 自动化常用命令执行系统管理和故障排除创建简单的应用程序处理文本或文件 1.2 Shell脚本基本结构&#xff1a; ​ Shell脚本编程&#xff1a;是基于过程式&#xff0c;解释执行的语言 编程语言…

从0到1精通自动化测试,pytest自动化测试框架,fixture之autouse=True(十二)

一、前言 平常写自动化用例会写一些前置的fixture操作&#xff0c;用例需要用到就直接传该函数的参数名称就行了。当用例很多的时候&#xff0c;每次都传这个参数&#xff0c;会比较麻烦 fixture里面有个参数autouse&#xff0c;默认是Fasle没开启的&#xff0c;可以设置为Tr…

4.27 功率谱

功率信号能量一定是无穷大的 1处解释&#xff0c;由于上述信号是截断信号&#xff0c;只有-T/2 ~ T/2有有效信号&#xff0c;因此有了1式 能量信号和能量密度构成傅里叶变换对 功率信号和功率密度构成傅里叶变换对 自相关函数和他的能量谱或者功率谱构成傅里叶变换对

Java框架之spring 的 AOP 和 IOC

写在前面 本文一起看下spring aop 和 IOC相关的内容。 1&#xff1a;spring bean核心原理 1.1&#xff1a;spring bean的生命周期 spring bean生命周期&#xff0c;参考下图&#xff1a; 我们来一步步的看下。 1 其中1构造函数就是执行类的构造函数完成对象的创建&#x…

代码随想录再战day3

力扣 209移除链表 思路&#xff1a; 第一&#xff1a; 首先明白 链表中的元素是无法被真正的删除的 只能替换指针的指向的元素 第二&#xff1a; 这道题是说移除链表中的目标元素&#xff0c;需要创建一个虚拟节点dummy去始终指向我们的头节点&#xff0c;能够保证我们最后输出…

Yolov5-Face 原理解析及算法解析

YOLOv5-Face 文章目录 YOLOv5-Face1. 为什么人脸检测 一般检测&#xff1f;1.1 YOLOv5Face人脸检测1.2 YOLOv5Face Landmark 2.YOLOv5Face的设计目标和主要贡献2.1 设计目标2.2 主要贡献 3. YOLOv5Face架构3.1 模型架构3.1.1 模型示意图3.1.2 CBS模块3.1.3 Head输出3.1.4 stem…

Ubuntu连不上网,在windows安装docker后

在windows上安装docker后&#xff0c;会依赖于virtualbox虚拟机&#xff0c;并且有虚拟网络&#xff0c;与ubuntu虚拟机网络产生冲突。 解决办法&#xff0c;打开网络适配器&#xff0c;禁用VirtualBox网络 这个时候就可以了。 ubuntu上使用docker pull镜像的时候&#xff0c…

MongoDB简介

目录 1、NoSQL概述 2、什么是MongoDB 3、MongoDB特点 一、MongoDB安装&#xff08;docker方式&#xff09; 二、MongoDB安装&#xff08;普通方式&#xff09; 三、MongoDB 概念解析 1、NoSQL概述 NoSQL(NoSQL Not Only SQL)&#xff0c;意即反SQL运动&#xff0c;指的是…

【AcWing算法基础课】第二章 数据结构(部分待更)

文章目录 前言课前温习一、单链表核心模板1.1题目描述1.2思路分析1.3代码实现 二、双链表核心模板2.1题目描述2.2思路分析2.3代码实现 三、栈核心模板3.1题目描述3.2思路分析3.3代码实现 四、队列核心模板4.1题目描述4.2思路分析4.3代码实现 五、单调栈核心模板5.1题目描述5.2思…

短视频矩阵抖音账号矩阵系统源码开发者自研(一)

一、短视频矩阵系统源码框架建模搭建 目录 一、短视频矩阵系统源码框架建模搭建 1.抖音账号矩阵系统功能模型建模 2.短视频账号矩阵系统接口开发规则 二、短视频矩阵系统源码视频剪辑转码处理 短视频矩阵系统是一个多功能的视频内容管理系统&#xff0c;用于创建、剪辑发布…

charles unknown 问题和手机代理设置(iOS手机)

一、Charles下载 下载地址&#xff1a;https://www.charlesproxy.com/download/ 二、Charles配置代理 1.查看本机IP&#xff1a;help-->Local IP Address 2.查看或者设置访问端口&#xff1a;Proxy->Proxy Settings 3.设置不代理计算机的请求&#xff08;推荐&#xff0…