HTML前端常用标签(复习)
qihemm 2025-06-25 18:23 8 浏览 0 评论
1. HTML 初识
- HTML 指的是超文本标记语言 (Hyper Text Markup Language)是用来描述网页的一种语言。
- HTML 不是一种编程语言，而是一种标记语言 (markup language)
- 标记语言是一套标记标签 (markup tag)
所谓超文本，有2层含义：
- 因为它可以加入图片、声音、动画、多媒体等内容（超越文本限制 ）
- 不仅如此，它还可以从一个文件跳转到另一个文件，与世界各地主机的文件连接（超级链接文本 ）。
标题标签 <hx></hx>
段落标签 <p></p>
水平线标签 <hr />
换行标签 <br/>
无语义标签 <div></div> 和 <span></span> 注:这两个标签在后期经常使用文本格式化标签
<b></b>和<strong></strong> 文字加粗
<i></i>和<em></em> 斜体
<s></s>和<del></del> 加删除线
<u></u>和<ins></ins> 加下划线图片标签
<img src="图像URL" /> src 图像路径 图像标签 <img src="图像URL" /> 该语法中src属性用于指定图像文件的路径和文件名，他是img标签的必需属性。
属性:
alt 文本,图像不显示时显示文字<img src="" alt="">
title 文本,鼠标悬停时显示内容<img src="cz.jpg" title="文本" />
width 图像宽度<img src="cz.jpg" width="300" height="300" />
height 图像高度<img src="cz.jpg" width="300" height="300" />
border 设置图像边框宽度<img src="cz.jpg" border="3" />
链接标签
<a href="#" target="目标窗口的弹出方式">文本或图像</a>属性：
href (链接地址)必须写 | 用于指定链接目标的url地址，（必须属性）当为标签应用href属性时，它就具有了超链接的功能 | 1. 外部链接 需要添加 http:// www.baidu.com | ||
target (默认当前窗口打开,可新建窗口打开) | 用于指定链接页面的打开方式，其取值有self和blank两种，其中_self为默认值，__blank为在新窗口中打开方式。 |
锚点标签
id="" | 锚点定位 | 通过创建锚点链接，用户能够快速定位到目标内容。 | <h3 id="two">第2集</h3> | 使用相应的id名标注跳转目标的位置。 (找目标) |
base标签
<base target="_blank" /> | base 可以设置整体链接的打开状态 | base 写到 <head> </head> 之间 |
预格式化标签
<pre>文本</pre> | 标签可定义预格式化的文本。 | 所谓的预格式化文本就是 ，按照我们预先写好的文字格式来显示页面， 保留空格和换行等。 |
表格标签
<table> 定义表格标签 | border | 设置表格边框(默认border="0"无边框) | <table> |
cellspacing | 设置单元格与单元格之间的空白间距 (默认2像素) | ||
cellpadding | 设置单元格内容与单元格边框之间的空白间距 (默认1像素) | ||
width | 设置表格的宽度 | ||
height | 设置表格的高度 | ||
align | 设置表格在网页中的水平对齐方式 (三个属性:left左 center中 right右 ) | align="center" align="right" | |
caption | caption 元素定义表格标题，通常这个标题会被居中且显示于表格之上。 | <caption>个人信息表</caption> | |
rowspan="合并单元格的个数" | 跨行合并 | 合并的顺序我们按照 先上 后下 先左 后右 的顺序 | |
colspan="合并单元格的个数" | 跨列合并 | <td colspan="3"> </td> | |
<caption></caption> | 表格标题标签 | ||
<tr></tr><td></td> | 标签，他就像一个容器，可以容纳所有的元素 | <tr><td></td></tr> | |
<th><td> | 一般表头单元格位于表格的第一行或第一列，并且文本加粗居中 | <th><td></td></th> | |
<thead> 于定义表格的头部。用来放标题之类的东西。<thead> 内部必须拥有 <tr> 标签！ | 以上标签都是放到table标签中。 | 更好的给表格划分结构 | |
<tbody> 用于定义表格的主体。放数据本体 。 | 以上标签都是放到table标签中。 | ||
<tfoot>放表格的脚注之类。 | 以上标签都是放到table标签中。 |
列表标签
列表(ul里面只能包含li ,li里面可以包含标签) | <ul><li></li></ul> | 无序列表 | 1. <ul></ul>中只能嵌套<li></li>，直接在<ul></ul>标签中输入其他标签或者文字的做法是不被允许的。 | 里面只能包含li 没有顺序，我们以后布局中最常用的列表 | ||
<ol><li></li></ol> | 有序列表 | 所有特性基本与ul 一致。 但是实际中比 无序列表 用的少很多。 | 里面只能包含li 有顺序， 使用情况较少 | |||
<dl> | 自定义列表 | 里面有2个兄弟， dt 和 dd |
input控件
<input type="属性值" value="你好"> | text | 单行文本输入框 | |
password | 密码输入框 | ||
radio | 单选按钮 | ||
checkbox | 复选按钮 | ||
button | 普通按钮 | ||
submit | 提交按钮 | ||
reset | 重置按钮 | ||
image | 图像形式的提交按钮 | ||
file | 文本域 | ||
name | 由用户自定义 | 控件的名称 | 用户名:<input type="text" name=“username” /> |
value | 由用户自定义 | input控件中的默认问本值 | 用户名:<input type="text" name="username" value="请输入用户名"> |
size | 正整数 | input控件在页面中的显示宽度 | |
checked 默认被选中 | checked | 定义选择控件默认被选中的项 | <input type="radio" name="sex" value="女" />女 |
maxlength | 正整数 | 控件允许输入的最多字符数 |
<label> </label>
<label> 用户名： <input type="radio" name="usename" value="请输入用户名"> </label> | 第一种用法就是用label直接包括input表单。 | 当我们鼠标点击 label标签里面的文字时， 光标会定位到指定的表单里面 | |
<label for="sex">男</label> | 第二种用法 for 属性规定 label 与哪个表单元素绑定。 | 当我们鼠标点击 label标签里面的文字时， 光标会定位到指定的表单里面 |
文本域
<textarea >文本内容</textarea> | 通过textarea控件可以轻松地创建多行文本输入框. | cols="每行中的字符数" rows="显示的行数" 我们实际开发不用 | <textarea > 文本内容</textarea> |
select下拉列表
<select> | 在option 中定义selected =" selected "时，当前项即为默认选中项。 |
form表单域
<form action="url地址" method="提交方式" name="表单名称"> | action 属性值:url地址 | 用于指定接收并处理表单数据的服务器程序的url地址。 |
method 属性值:get/post | 用于设置表单数据的提交方式，其取值为get或post。 | |
name 属性值:名称 | 用于指定表单的名称，以区分同一个页面中的多个表单。 |
以上标签基本包含了前端开发所需常用标签.来自本人,黑马程序员.传智播客学习笔记.
以下是个人笔记整理,需要请关注私信我.
希望本人笔记能对各位有所帮助.
前端不难,难的在于东西多和杂.每天努力学习一点点,不放弃.
相关推荐
- VLOOKUP的18种高阶用法大公开!99%的人都不知道的神操作!
-
作为被头条用户催更的Excel课代表，今天带来让HR追着要模板、让老板主动加薪的VLOOKUP终极指南！从基础到高阶一网打尽，文末送36个行业专用模板！一、为什么你的VLOOKUP总报错？血泪大数据...
- Vlooup公式，2种模糊查找匹配，1分钟学会
-
工作中，VLOOKUP公式使用频率是很高的，用来各种查找匹配问题今天我们分享两种模糊查找匹配问题，一种是文本的模糊查找匹配，一种是数字的模糊查找匹配问题1、文本模糊查找匹配使用模拟数据举个例子，原始数...
- 与vlookup功能相似的函数，照样搞定表格数据查询，简单还实用
-
在日常表格数据处理工作，说到数据查询，很多小伙伴首先想到的是Vlookup函数，老师的教程中也多次讲到Vlookup函数的用法和实例。其实在Excel中还有其他的数据查询函数公式或技巧，今天我们先来学...
- 别再折腾VLOOKUP了!DGET逆向查找10秒通关，小白必看
-
今天要掀翻一个“过气网红”——VLOOKUP！你是不是也经历过这些崩溃瞬间：逆向查找要交换列顺序，复制粘贴到手软！多条件查找要嵌套MATCH，公式长到怀疑人生！别忍了！今天教你用DGET函数一键封...
- 职场新人必学!VLOOKUP函数10分钟速成指南
-
正文："今天来讲解办公人入职期初函数VLOOKUP，这是所有职场人最重要也是最基础的技能。掌握它，90%的数据查找再不用求人！特别献给刚入职场的你——别让Excel成为加班理由。"——...
- 巧用Vlookup函数揪出“第三者”（vlookup第三个参数是什么）
-
在一张Excel表格的重复记录中，让你快速列出每种不同物品第2次或第n次出现的记录，你会怎么做？Vlookup函数就有这个本事。举例来说，产品或者物流表格中往往会记录有同一货物的多笔数据（如下图的今日...
- 分享12个VLOOKUP超经典用法（vlookup通俗易懂）
-
刚毕业那会，面试的时候经常会被问到会不会用Excel？我就理直气壮地回答：“会啊。”毕竟，简历上可是写着熟练。接着面试官扔出一句“那你会VLOOKUP吗？”我还是会一口咬定：“我会。“其实，我都没用过...
- 查找匹配别只知道Vlookup，Sumifs也可以!
-
工作中遇到查找匹配问题的时候，大家第一反应是不是都想到的Vlookup公式呢，有没有小伙伴们给Sumifs一点点机会的呢，有时候Sumifs比Vlookup更好用1、Vlookup公式举个例子，左边是...
- Excel函数讲解:VLOOKUP函数，轻松玩转数据查找
-
常用函数系列教学：VLOOKUP函数讲解(46)。不懂VLOOKUP函数怎么高效查找数据？闲话少叙直接开讲。基本含义：VLOOKUP函数用于在表格按垂直方向(到)上查找返回行数据。如何使用及注意事项？...
- CHOOSEROWS+CHOOSECOLS原来是一个超级查找函数组合!
-
场景一：要在学生名册中，抽查一名学生成绩。公式：=CHOOSEROWS(A1:D5,2)解析：第一参数A1:D5为数据区域，第二参数2表示提取第2行数据。把数据区域改为A2:D5,结合RANDBETW...
- 数据查询不止有vlookup函数，自定义zlookup函数查询操作更高效
-
Excel数据查询，相信大家首先会想到vlookup函数。毋庸置疑vlookup函数在Excel数据查询中作用是非常的强大。但是它也有一些不能实现的数据查询。如上图所示，我们需要根据人员的出现次数，提...
- 「EXCEL进阶」VLOOKUP函数怎么查询一个值返回多个结果
-
前言：VLOOKUP函数一般一次只能返回一个结果，本例介绍通过辅助列的方法使VLOOKUP函数查询一个值，返回这个值对应的多个结果。使用场景举例：根据表格中同一数值，返回对应值的多个结果。比如这张数据...
- WPS查找能手VLOOKUP函数使用方法讲解
-
各位同学好！今天我们来深度剖析WPS最实用的查找工具——VLOOKUP函数。这个函数能帮你在表格中快速定位并提取所需数据，可以帮你快速核对两批数据差异，还可以合并多个表格的关联信息，甚至可以帮你制作动...
- Excel常用10个函数:跨表查找Vlookup，适用于大数据中查找精确值
-
Hello大家好，我是Office米，今天，我们将和大家一起分享交流，常用的10个函数之一：查找引用函数VLOOKUP。在说VLOOKUP函数之前，我们要先了解，平时Excel日常工作中会遇到哪些问题...
- 掌握了这个套路，无论用 Excel vlookup 函数查找第几次结果都很轻松
-
用vlookup查找默认情况下是一对一出结果，如果要一对多查找，就需要用到各种技巧，具体方法我写过非常多了，可以搜索一下历史记录。只要掌握了今天这个套路，无论你想查找第几次重复值，都易如反掌。案例...
欢迎 你 发表评论:
- 一周热门
- 最近发表
-
- VLOOKUP的18种高阶用法大公开!99%的人都不知道的神操作!
- Vlooup公式，2种模糊查找匹配，1分钟学会
- 与vlookup功能相似的函数，照样搞定表格数据查询，简单还实用
- 别再折腾VLOOKUP了!DGET逆向查找10秒通关，小白必看
- 职场新人必学!VLOOKUP函数10分钟速成指南
- 巧用Vlookup函数揪出“第三者”（vlookup第三个参数是什么）
- 分享12个VLOOKUP超经典用法（vlookup通俗易懂）
- 查找匹配别只知道Vlookup，Sumifs也可以!
- Excel函数讲解:VLOOKUP函数，轻松玩转数据查找
- CHOOSEROWS+CHOOSECOLS原来是一个超级查找函数组合!
- 标签列表
-
- 正版织梦模板 (30)
- 单片机c语言入门基础知识 (32)
- 手机编程游戏 (29)
- 优秀企业网站模板 (34)
- python编程入门自学书籍 (34)
- phpcms安装 (30)
- 自学excel免费视频教程全集 (36)
- php加密系统源码 (29)
- vlookup函数查找 (30)
- 电脑怎么下载java (32)
- vba编程实例速成150例 (30)
- 函数subtotal的用法 (31)
- java教程txt (32)
- java软件开发面试题 (30)
- sql数据库备份与还原方法 (33)
- 后台管理系统网站模板 (30)
- html表单属性有哪些 (31)
- 初中数学三角函数公式 (32)
- python爬虫教程 (30)
- 三角函数值对照表0到360度 (33)
- oracle数据库下载教程 (31)
- index函数什么意思 (34)
- indirect函数的详细用法 (31)
- excel函数round用法 (32)
- vlookup一对多查询并提取 (35)