Html标签学习笔记(表单除外)

最新推荐文章于 2024-04-22 12:21:13 发布
最新推荐文章于 2024-04-22 12:21:13 发布
阅读量135 收藏
点赞数
分类专栏： html5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_40604099/article/details/106139379
版权
  • 最后附代码
    1.文件标签:构成htm1最基本的标签
  • html : html文档的根标签
  • head:头标签。用于指定html文档的- - 些属性。引入外部的资源
    title :标题标签。
    body :体标签
    < IDOCTYPE html> : html5中定义该文档是html文档
    2.文本标签:和文本有关的标签I
注释：<!-- 内容 -->
<h1> to <h6>标题标签 字体大小逐渐递减
<p>段落标签
<br>换行标签
<hr>显示一行水平线
	*属性
		*color：颜色
		*width：宽度
<b>字体加粗
<i>字体斜体
<font>:字体标签（h5已经废用）
属性定义：
	*color：颜色
		1.英文单词：redgreen，blue
		2.rgb如：rgb（0，0，225）
		3.#值1值2值3：范围00~FF之间
	*width:宽度
		1.数值：width=‘20’，单位默认px（像素）
		2.%数值：占比相对于父元素的比例
	*center:文本居中

3，图片标签:

<img>图片标签
src="图片目录"
<!--
    相对路径
        以.开头的路径
        ./表示当前路径
        ../表示后退上一级目录
        
-->

4，列表标签:

	*有序列表
		*ol
		*li
	*无序列表
		*ul
		*li

5，链接标签:

<a>定义一个超链接
	*属性
		*href：指定访问资源的url
		*target:指定跳转方式
			*_self:默认值，在当前页面打开
			*_blank:在新窗口打开

6.块标签

<!--
    div:没一个div占满一行，块级标签
    span：文版信息只在一行显示，内联标签
-->
<span>
<div>

7.语义化标签

<header>
<footer>

8.表格标签:

*<table> 定义表格
	*width:宽度
	*border：边框
	*cellpadding：定义内容和单元格之间的距离
	*cellspacing：定义单元格之间的距离
	*bgcolor:背景色
	*align:对齐方式
*<tr> 定义行
*<td> 定义单元格
*<th> 定义表头单元格

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>标签学习</title>
</head>
<body>
<!-- 注释 -->
<!--br 换行-->
白日依山尽，<br>
黄河入海流。<br>

<!--标题标签 h1~h6-->
竹鼠商人<br>
<h1>竹鼠商人</h1>
<h2>竹鼠商人</h2>
<h3>竹鼠商人</h3>
<h4>竹鼠商人</h4>
<h5>竹鼠商人</h5>
<h6>竹鼠商人</h6>

<!--段落标签 p-->
<p>
1.竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人
</p>
<p>
    2.竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人
</p>
<p>
    3.竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人竹鼠商人
</p>

<!--hr 显示一条水平线-->
<hr>

<b>竹鼠商人B标签</b><br>
<i>竹鼠商人i标签</i>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图片标签学习</title>
</head>
<body>
    <img src="./image/锁屏.jpg">
<!--
    相对路径
        以.开头的路径
        ./表示当前路径
        ../表示后退上一级目录

-->
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列表标签</title>
</head>
<body>
<!--有序列表-->
早上起床干的事<br>
<!--type表示前面的数字 start是第一个-->
<ol type="A" start="B">
    <li>睁眼</li>
    <li>看手机</li>
    <li>穿衣服</li>
    <li>洗漱</li>
</ol>
<!-- 无序列表-->
<!--type是标识符类型-->
<ul type="">
    <li>睁眼</li>
    <li>看手机</li>
    <li>穿衣服</li>
    <li>洗漱</li>
</ul>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>链接标签</title>
</head>
<body>
<!--跳转到百度-->
<a href="https://www.baidu.com/">点我跳转(当前窗口)</a><br>
<!--打开一个新窗口显示百度-->
<a href="https://www.baidu.com/" target="_blank">点我跳转(新窗口)</a><br>
<!--打开本地资源-->
<a href="./列表标签.html">点我跳转列表标签</a><br>
<a href="图片标签.html"><img src="./image/桌面.png"></a>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格标签</title>
</head>
<body>
<table border="1" width="50%" cellpadding="0" cellspacing="0">
    <tr>
        <th>编号</th>
        <th>姓名</th>
        <th>成绩</th>
    </tr>
    <tr>
        <td>001</td>
        <td>竹鼠一号</td>
        <td>100</td>
    </tr>
    <tr>
        <td>002</td>
        <td>竹鼠二号</td>
        <td>50</td>
    </tr>
</table>
</body>
</html>
竹鼠商人
关注
专栏目录
doctype html的作用是什么,DOCTYPE的作用
weixin_35035699的博客
06-20 5479
DOCTYPE html当查看网页源代码时，经常都能见到在顶部有一条很长的代码，这条代码就是用于对网页的声明，DOCTYPE的声明是网页形成的一个关键部分，现在就来详细的了解一下它的用途及声明的类型。相对于现在的HTML5，DOCTYPE声明中的写法已变得简明，DOCTYPEhtml>是现在HTML5的标准声明，无论是用记事本、或是用网页制作工具创建一个HTML页面时，只需要在代码的开头写上...
html中的doctype有什么作用,HTML中doctype的作用及几种类型详解
weixin_36200503的博客
06-10 3297
一、DOCTYPE标签的定义与作用是一个用于声明当前HTMl版本，用来告知web浏览器该文档使用是哪种 HTML 或者 XHTML 规范来解析页面，以便浏览器更加准确的理解页面内容，更加良好地展现内容效果！二、DOCTYPE标签的特点1. 标签没有结束标签；2.声明被所有主流浏览器支持；3.声明不是一个HTML标签，在HTML5中是可以不区分大小写的；4.声明必须位于HTML文档中最前面，处于标签...
＜!DOCTYPE html＞是什么意思?
qq_36976201的博客
03-07 4480
< !DOCTYPE html >是html5标准网页声明,全称为Document Type HyperText Mark-up Language，意思为文档种类为超文本标记性语言或超文本链接标示语言，现在是这个简洁形式，支持html5标准的主流浏览器都认识这个声明。表示网页采用html5，<!DOCTYPE> 声明位于文档中的最前面的位置，处于 标签之前。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。 < DOCTYPE> 不是 HTML 标签。它为
<DOCTYPE html> 是什么？
JavaScript架构设计
10-21 1305
查看了一下百度的源码，发现第一句就是，不明白是什么个意思就google了一下，发现这东东用处还蛮大的！ 以下来自http://i.wanz.im/2010/05/28/why_doctype_html/        不管是刚接触前端，还是你已经“精通”web前端开发的内容，你应该知道在你写html的时候需要定义文档类型；你知道如果没有它，浏览器在渲染页面的时候会使用怪异模式；你知道各
HTML学习笔记
weixin_66749281的博客
07-20 682
网页是前端开发人员写的，通过浏览器才能访问阅读的页面网页是网站的”一页“。文件扩展名为.htmlHTML是用来描述网页结构的一种语言，是Web最基本构件块，它定义了Web内容的含义和结构。HTML指的是超文本标记语言(HyperTextMarkupLanguage)，“超文本”是指在单个网站内或网站之间将网页相互连接起来的链接。HTML不是一种编程语言，而是一种标记语言(markuplanguage)，由一系列标记组成。......
【HTML】学习笔记
DeDeDeFeng的博客
08-11 1215
根据学习视频和笔记思路进行整体的学习笔记整理
HTML常见标签学习和笔记总结
SkyFreeStyle的博客
04-09 598
HTML常见标签学习与笔记总结表头<head><title> 浏览器标题栏显示的内容<base> 有href和target属性，href指定网页中所有超链接的基本目录，target指定打开超链接的方式，如_blank为在新窗口中打开<meta> name网页的描述信息，可以设置网页搜索的关键字keywords。http-equiv可以设置自动刷新
django学习笔记
sober30的博客
07-27 880
Django官网：https://www.djangoproject.com/Django 采用了 MVT 的软件设计模式，即模型（Model），视图（View）和模板（Template）。建议图：用户操作流程图：Django 本身基于 MVC 模型，即 Model（模型）+ View（视图）+ Controller（控制器）设计模式优势：低耦合开发快捷部署方便可重用性高维护成本低。。。。。。简易图。
学习笔记：尚硅谷Vue2基础篇
D_boj的博客
04-22 1156
通过B站尚硅谷学习，了解Vue2基本概述，以及基本使用。本章节主要了解选项式API以及组件化编程
《HTML5与CSS3基础教程》第六章学习笔记 链接
Cap220590的博客
02-23 422
文章目录第6章 链接6.1 创建指向另一个网页的链接1.创建指向另一个网页的链接2.HTML块级链接6.2 创建锚并连接到锚6.3 创建其他类型的链接 第6章 链接 链接有两个主要部分： 目标：指定访问者点击链接时会发生什么，常见的是连接到其他网页或者网页的特定位置 标签：访问者在浏览器中看到的部分，激活标签就可以到达连接的目标 锚：网页的特定位置称之为“锚” 6.1 创建指向另一个...
【前端】layui前端框架学习笔记，2024年最新大厂hr面试问题
m0_60707660的博客
04-18 731
yyyy-MM-dd通过日期时间各自的格式符和长度，来设定一个你所需要的日期格式。layDate 支持的格式如下格式符说明yyyy年份，至少四位数。如果不足四位，则前面补零y年份，不限制位数，即不管年份多少位，前面均不补零MM月份，至少两位数。如果不足两位，则前面补零。M月份，允许一位数。dd日期，至少两位数。如果不足两位，则前面补零。d日期，允许一位数。HH小时，至少两位数。如果不足两位，则前面补零。H小时，允许一位数。mm分钟，至少两位数。
CSS学习笔记
怀抱清风的博客
03-22 1778
CSS学习大纲: 学会使用CSS选择器 熟记CSS样式和外观属性 熟练掌握CSS各种选择器 熟练掌握CSS各种选择器 熟练掌握CSS三种显示模式 熟练掌握CSS背景属性 熟练掌握CSS三大特性 熟练掌握CSS盒子模型 熟练掌握CSS浮动 10.熟练掌握CSS定位 11.熟练掌握CSS高级技巧强化CSS typora-cop...
3.1 前端学习笔记之XML与HTML、JavaScript、jQuery、AJAX、JSON的区别
qq_43456781的博客
08-15 1641
文章目录一、XML与HTML前言简介XML与HTML的区别最重要的区别（自我认为）二、官网的英文解释：三、JavaScript四、jQuery五、Ajax六、JSON七、总结 一、XML与HTML 前言 为什么我会突然学XML呢？我在学习用JSP写Web后台的时候，常常会看到“等价的XML语句”、“符合XML标准”等字眼，并且在我新建的JSP项目中也发现有很多的.xml文件，我很想知道这些.xml文件的作用以及与JSP（或者说是与Java）的联系，就试着开始学习XML了。 简介 XML的全称为可扩展标记语言
DIV+CSS学习笔记总结篇
qianduan666a的博客
07-29 890
DIV+CSS学习笔记总结篇 第一部分 HTML 第一章 职业规划和前景 职业方向规划定位： web前端开发工程师 web网站架构师 自己创业 转岗管理或其他 web前端开发的前景展望： 未来IT行业企业需求最多的人才 结合最新的html5抢占移动端的市场 自己创业做老板 随着互联网的普及web开发成为企业的宠儿和核心 web职业发展目标： 第一、梳理知识架构 负责内容的HTML 负责外观的css（层叠样式表） 负责行为
基于大模型技术的算力产业监测服务平台设计
09-17
内容概要：本文提出了一种新型算力产业监测服务平台的设计理念，运用国内自主研发的大模型技术支持，通过对传统技术的改进和完善，提出了三层架构的设计方法，即基础设施层（含向量数据库和模型训练）、大模型应用框架层（强化数据处理与多维关系挖掘）及业务层（如智能分析助手）。这种设计方案旨在提高算力产业发展监测与决策制定的质量。 适合人群：电信行业的从业人员及研究人员；算力产业链各环节管理者；政府相关机构和政策决策者。 使用场景及目标：在多种算力相关的应用场景（如云计算中心管理，数据中心监测，政策分析）中辅助决策者进行快速有效的信息获取和技术选择；助力算力产业发展方向的精确把控和战略调整。 其他说明：随着大模型技术的日臻成熟，该算力产业监测服务平台预计将进一步丰富自身的应用领域和服务深度，以促进算力行业更智慧化发展。
This_honeypot_supports_Telnet_and_SSH_two_protocol_FF-Pot.zip
最新发布
09-17
This_honeypot_supports_Telnet_and_SSH_two_protocol_FF-Pot
吉他谱_What I've Done - Linkin Park.pdf
09-17
初级入门吉他谱 guitar tab
吉他谱_Too sweet - Hozier.pdf
09-17
初级入门吉他谱 guitar tab
HTML5学习笔记：优势、语法与表单元素详解
HTML5的学习笔记涵盖了从基础语法到高级特性的全面内容，包括语义化、表单设计、多媒体处理和现代通信技术，这对于提升网页开发效率和兼容性具有重要意义。对于前端开发者而言，掌握HTML5不仅是技术更新的要求，也是...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值