HTML 中的标签存放于文本文件中 需要按照以下固定的文档结构组织：<!DOCTYPE HTML><html> <head>头部相关信息 </head> <body> 页面主体相关内容 </body></html> 标签解释：#1、<!DOCTYPE HTML>是文档声明，必须写在HTML文档的第一行，位于<html>标签之前，表明该文档是HTML5文档。 #2、<html></html> 称为根标签，所有的网页标签都在<html></html>中。 #3、<head></head> 标签用于定义文档的头部，它是所有头部元素的容器。常见的头部元素有<title>、<script>、<style>、<link>和<meta>等标签，头部标签在下一节中会有详细介绍，<head>与</head>之间的内容不会在浏览器的文档窗口显示，但是其间的元素有特殊重要的意义。 #4、在<body>和</body>标签之间的内容是网页的主要内容，最终会在浏览器中显示出来。 标签关系：并列和嵌套并列：head 和body嵌套：html内有body 二 HTML标签详细语法与注意点 标签的语法： <标签名 属性1=“值1” 属性2=“值2” ......>内容部分</标签名><标签名 属性1=“值1” 属性2=“值2” ....../>注意： #1. HTML标签不区分大小写，`<h1>`和`<H1>`是一样的，但是我们通常建议使用小写，大部分程序员都以小写为准。 #2. 标签之间是可以嵌套的。例如：<div><p>段落</p></div>,但不能交叉<div><p></div></p> #3、不是所有标签都支持互相嵌套。 三 HTML中标签分类：单从是否可以嵌套子标签的角度去分， 标签分为两类1：容器类标签（能嵌套其他标签）h 系列ul>liol>lid1>dt+dddiv 2文本标签（文本标签 只能嵌套文字、图片超连接标签。 p span strong em ins del 四 head内常用标签1 meta 相关#1、指定字符集<meta charset="gbk"> #2、页面描述<meta name="Description" content="具体描述。。。"> #3、关键字：有助于搜索引擎SEC优化，再怎么优化也抵不过竞价排名<meta name="Keywords" content="网易，邮箱，游戏，新闻"> #4、3秒后跳转<meta http-equiv="refresh" content="3,http://www.baidu.com">#5、三秒刷新<meta http-equiv="refresh" content="3"> 2：非meta标签#1、标题<title>百度一下，你就知道</title> #2、网站的图标<link rel="icon" href="https://www.baidu.com/favicon.ico"> #3、定义内部样式<style></style> #4、引入外部样式文件<link rel="stylesheet" href="mystyle.css"> #5、定义JavaScript代码或引入JavaScript文件<script src="hello.js"></script> 五 body标签h 标签h1~ h6 标记内容为1~6级标题 p 标签 标记为内容 的一哥段落 img标签 标记一哥图片用法：<img src="图片地址" alt="图片加载失败时显示的内容" title = "鼠标悬停到图片上时显示的内容" />2.1 src指定的图片地址可以是网络地址，也可以是一个本地地址，本地地址可以用绝对或相对路径，但通常用相对路径，相对路径是以html文件当前所在路径为基准进行的 2.2 图片的格式可以是png、jpg和gif 2.3 alt="图片加载失败时显示的内容" 2.4 title = "鼠标悬停到图片上时显示的内容" 2.5 如果没有指定图片的width和height则按照图片默认的宽高显示，如果指定图片的width和height则可能让图片变形那如果又想指定宽度和高度，又不想让图片变形，我们可以只指定宽度和高度的一个值即可只要指定了一个值，系统会根据该值计算另外一个值，并且都是等比拉伸的，图片将不会变形 a标签标记一哥内容为超链接#1、超链接标签是超文本文件的精髓，可以控制页面与页面之间的跳转，语法如下<a href="跳转到的目标页面地址" target="是否在新页面中打开" title="鼠标悬浮显示的内容">需要展现给用户查看的内容/也可以是图片</a> #2、注意：2.1 a标签不仅可以标记文字，也可以标记图片 <a href="https://www.baidu.com"><img src="mv.png" />百度一下，你就知道</a> 2.2 a标签必须有href属性，href的值必须是http://或https://开头 2.3 a标签还可以跳转到自己的页面 <a href="template/aaa.html">锤你胸口</a> 2.4 target="_blank"代表在新页面中打开，其余的值均无需记忆， 如果页面中大量的a标签都需要设置target="_blank",那么我们可以在head标签内新增一个base标签进行统一设置 <base target="_blank"> 如果a标签自己设置了target，那么就以自己的为准，否则就会参照base的设置 2.5 title="鼠标悬浮显示的内容 列表标签语义 标记一堆数据是一个整体列表HTML分三种1 无序列表ul>li 列表标签中使用最多的一种非常重要2 有序列表 极少用 ol>li3 自定义列表 经常用<dl> <dt>自定义标题1<dt> <dd>描述1<dd> <dd>描述2<dd> <dd>描述3<dd></d1> <table>标签语义：标记一段数据为表格#1、作用表格标签是一种数据的展现形式，当数据量非常大的时候，使用表格的形式来展示被认为是最清晰的 #2、格式<table> <tr> <td></td> </tr></table> tr代表表格的一行数据td表一行中的一个单元格 #3、注意点：表格标签有一个边框属性，这个属性决定了边框的宽度。默认情况下这个属性的值为0，所以看不到边框 form 标签语义标记表单#1、什么是表单？ 表单就是专门用来接收用户输入或采集用户信息的 #2、表单的格式 <form> <表单元素> </form>
原文地址：https://www.cnblogs.com/lx3822/p/9163803.html
时间： 2024-10-14 17:09:15