HTML结构和基本语法

最新推荐文章于 2024-12-10 16:54:57 发布
原创 最新推荐文章于 2024-12-10 16:54:57 发布 · 246 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#xml

本文将深入浅出地讲解HTML5文档结构，从doctype声明、根元素到常用标签如标题、段落、链接，以及超链接、列表的详细用法。了解如何利用这些基础构建结构清晰、兼容广泛的网页。

文档结构介绍：

标签属性

  • 文档声明：用于声明当前HTML的版本，这里的<!DOCTYPE html>是HTML5的声明

  • html根标签：除文档声明以外，其它内容全部要放在根标签html内部

  • 文档头部配置：head标签，是当前页面的配置信息，外部引入文件, 例如网页标签、字符集等

  • 文档显示内容：body标签，里边的内容会显示到浏览器页面上

  • HTML语法规范

  • 扩展名是html或者htm

  • html标签不区分大小写

  • html由头(head)和体(body)组成

  • 标签是可以嵌套的,标签里面可以放标签

  • 标签一般由起始标签开始，结束标签终止(成对出现)。但是如果标签不修饰内容，可以在标签里结束.

  • 属性是属于标签的，修饰标签，让标签有更多的效果

  • 属性一般定义在起始标签里面。

  • 属性一般以 属性名=属性值的形式存在

  • 属性值一般用 '' 或者“ ” 括起来。 不加引号也是可以的.(不建议使用)

    • <标签名/> 空标签

HTML常用的标签

  1. 标题标签

<hn></hn>   n取值1~6

段落标签 段落之间自动进行换行

<p></p>

粗体标签

<b></b>

斜体标签

<i></i>

换行标签

<br/>

下划线标签

语法:
<img src="图片路径" width="宽" height="高" alt="图片描述" title="用于告诉浏览器, 当鼠标悬停在图片上时, 需要弹出的描述框中显示什么内容"/>

无序列表

<ul type="类型">
    <li>需要显示的条目内容</li>
    ...
</ul>
 <!--type属性: 列表的类型; circle: 空心圆; square: 实心的正方形-->

超链接标签的格式:
        <a href="指定需要跳转的目标路径" target="打开的方式">需要展现给用户查看的内容</a>
        target属性取值: 
            _blank：新起页面
            _self：当前页面（默认）

  • 无序列表

  • <ul type="circle\square\默认实心圆">

  • 有序列表

  • <ol type="" start="">
        <li></li>
    </ol>

  • 超链接标签

  • <a href="" target="打开方式">文本</a>

    target取值:
        _self  当前窗口打开【默认】
        _blank 新开一个窗口

  •  

     

  •  

     

     

     

     

     

     

Java微梦
关注
HTML 语法规范及其基本结构标签
酷爱前端的小陈博客
04-16 1487
1. HTML 语法规范 1.1 基本语法概述 1. HTML 标签是由尖括号包围的关键词，例如 <html>。 2. HTML 标签通常是成对出现的，例如 <html> 和 </html> ，我们称为双标签。标签对中的第一个标签是开始标签，第二个标签是结束标签。 3. 有些特殊的标签必须是单个标签（极少情况），例如 <br />，我们称为单标签。 1.2 标签关系 双标签关系可以分为两类：包含关系和并列关系 2. ...
web前端-html基本结构和语法规范详解
主营前端方向，技术栈是vue
10-23 739
html基本结构和语法规范(文档声明，说明、属性，大小写，注释，标签结构，引号问题)
HTML基本语法和结构
weixin_43041350的博客
05-07 353
基本规范 HTML标签是： 由尖括号包围的关键词， 通常成对出现（双标签，常规元素），特殊的单个标签（单标签，空元素） HTML标签名、类名、标签属性和大部分属性值统一用小写 HTML文档后缀名必须是.html或.htm <body>这是双标签</body> <br/> <!-- 单标签--> 标签关系 双标签的关系分为：包含关系和并列关系 包含关系：也就是嵌套 <head> <title><.
HTML的结构与语法
lihaikuo666的博客
07-11 882
HTML结构与语法HTML 是由各种各样的标签组成，学习 HTML就是学习使用这些标签。从下节开始就详细介绍HTML的标签使用.学习HTML就是学些标签的使用，本节讨论下html结构。首先我们先看个例子：HTML文档结构 l html标签 -- 称为根标签，所有的网页标签都在&lt;html&gt;&lt;/html&gt;中。l head标签，代表HTML文档的头信息，以&lt;head&gt;...
2019web前端教程学习路线，HTML5的标签和语法
weixin_33921089的博客
02-25 200
近两年来，前端开发工程师越来越火了，薪资待遇也快接近后端开发工程师了。2019年已经到来了，很多准备入行前端开发工程师的小伙伴们，不知道准备得怎么样了呢？有的小伙伴很迷茫，想学前端，却没有方向！今天来给大家讲讲，在2019年，我们学习前端开发，如何才能高效学会前端开发？ HTML基本结构和HTML基本语法 HTML基本结构 HTML的基本语法 1、<常规标记> <标记 属性=“属...
HTML的文档结构与基本语法
guttaoqibao的博客
09-15 468
用HTML编写的超文本文称为HTML文档（文件），是一个放置了“标签”的文本文件，以“.html”或“.htm“为扩展名，可供浏览器解释执行的网页文件。 一个HEML文档的内容一般位于和之间，分为头部和主体两部分。
html文档结构和基本语法
qq_37620161的博客
06-30 389
1.HTML4文档基本结构 <html> <!-- 根标签 --> <head> <!-- 头部信息 --> <meta charset="utf-8"> <title></title> </head> <body> <!-- 主体信息 --> </body> </html> 2.HTML4基本语法 1.所有标签都包含在 ‘<’ 和
HTML5 基础语法结构与标签应用详解
12-23
内容概要：本文档详细介绍了HTML5的基础语法结构和各种标签的应用。涵盖了HTML的基本概念、语法特点、文档结构、常见标签及其属性，以及如何在网页中使用这些标签创建基本的网页结构。具体包括文档声明、字符集设置...
html基础语法
02-25
HTML 基础语法是指 HTML 文档的基本语法规则，包括标签、属性、值、实体、注释、特殊符号等。 HTML 文档结构： * HTML头：用于指定 HTML 文档的基本信息，包括标题、样式表、脚本等。 * body：用于指定 HTML 文档...
【HTML入门教程】从0到1：HTML基础语法、文档结构及多媒体元素应用指南
最新发布
08-17
接着详细讲解了HTML基础语法，包括标题标签、段落标签、链接标签和图像标签等基本标签及其属性的使用方法。文档还阐述了HTML文档结构，如文档类型声明、根元素、头部元素和主体元素的作用与构成。在实践部分，指导...
(一)html语法和基本结构
cloud-2014的专栏
07-19 1604
1.什么是HTML标记语言 表示网页信息的符号标记语言 特点 1.可以设置文本的格式，比如标题、字号、文本颜色、段落等等 2.可以创建列表 3.可以插入图像和媒体 4.可以建立表格 5.超链接，可以使用鼠标点击超链接来实现页面之间的跳转 2.HTML的标记和他的属性 标记 1.HTML文档的保存格式 .html .htm .xhtml 2.标记和被标记的内容构建出HTM
html语法基本结构
github_37454089的博客
02-20 407
内容解释 html文档的文档标记，也称为HTML开始标记功能 标记分别位于网页的最前端和最后端 内容HTML文件头标记，也称为HTML头信息开始标记用来包含文件的基本信息，比如网页的标题、关键字，在<head></head>内可以放<title></title>、<meta></meta>、<style></style>等等标记注意：在<head></head>标记内的内容不会在浏览器中
HTML基础语法，结构！
Ju_lian的Blog
01-15 646
1. 标签由英文尖括号和>括起来，如就是一个标签。 2. html中的标签一般都是成对出现的，分开始标签和结束标签。结束标签比开始标签多了一个/。 3.标签具有先后顺序 //div是嵌套在html标签内故在结束标签上也需要在其之前结束。 4.标签不区分大小写如： == ，但是一般情况用于小写表示！ 5.html有着自己的结构 ... ...
想知道HTML语法结构？看这一篇就够了（超全解析html语法）
海盗船长y的博客
05-24 8481
NTML文档结构 HTML文档由4个主要标记组成，包括<html>、<head>、<title>、<body>.这4个标记构成了HTML页面最基本的元素。 1.<html>标记 <html>标记是HTML文件的开头。 所有的HTML文件都以标记开头，以标记结束，即HTML页面的所有标记都要放置在与标记中。 标记虽然没有实质性的功能，但却是HTML必不可少的部分。 2.<head>标记 <head>标记是
HTML的基本结构语法
qq_38182287的博客
05-09 507
1.HTML基本结构          头部《head》 主体《body》 常用编码 （1）      gb2312：简体中文，一般用于包含中文和英文的页面 （2）      ISO-885901:纯英文，一般用于只包含英文的页面 （3）      big5：繁体，一般用于带有繁体字的页面 （4）      utf-8：国际通用的字符编码，同样适用于中文和英文的页面 2.标题
HTML
Puzzle_48hcy的博客
04-17 498
一、HTML的基本结构语法 1.HTML基本结构          头部《head》 主体《body》 常用编码 （1）      gb2312：简体中文，一般用于包含中文和英文的页面 （2）      ISO-885901:纯英文，一般用于只包含英文的页面 （3）      big5：繁体，一般用于带有繁体字的页面 （4）      utf-8：国际通用的字符编码，同样适用于中
HTML的基本结构语法 表格， 框架， 表单
qq_38182287的博客
05-09 7264
三、表格 1.表格基本语法：                                  内容               2.表格的对齐方式： 属性 值 说明 align （水平对齐方式） left 左对齐 center 居中对齐 right 右对齐
HTML 基本语法
qq_25699299的博客
12-10 2019
表格标题头部结构内容内容结构，一个 tr 标签代表一行，td 标签代表一个单元格脚注内容
HTML基本语法
magician_8的博客
09-07 295
一、HTML文件基本结构 1.一个HTML文件主要包括开始标签&lt;html&gt;、头部标签&lt;head&gt;、文件标题标签&lt;title&gt;以及主体标签&lt;body&gt;四部分。 结构如下： &lt;!DOCTYPE HTML&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8&quo
Html 基本语法结构
06-23
### HTML 基本语法结构 HTML（HyperText Markup Language）是构建网页的基础语言，其基本语法结构由一系列的元素组成。这些元素通过标签的形式定义内容的结构和语义。以下是 HTML 的基本语法结构及其组成部分： #### 1. 文档声明 HTML 文档通常以 `<!DOCTYPE html>` 开始，这一声明告诉浏览器该文档遵循 HTML5 标准[^2]。例如： ```html <!DOCTYPE html> ``` #### 2. HTML 元素的基本结构 HTML 元素由开始标签、内容和结束标签组成。例如： ```html <p>这是一个段落。</p> ``` - **开始标签**：`<p>` 表示段落的开始。 - **内容**：`这是一个段落。` 是标签之间的文本内容。 - **结束标签**：`</p>` 表示段落的结束。 某些元素是自闭合的，不需要结束标签。例如 `<img>` 和 `<br>`[^3]。 #### 3. 网页的基本结构 一个完整的 HTML 文档包含以下部分： - **`<html>`**：根元素，表示整个 HTML 文档的开始和结束。 - **`<head>`**：包含文档的元信息，如标题、字符编码等。 - **`<body>`**：包含网页的实际内容，如文本、图像、视频等。 完整的 HTML 结构如下所示： ```html <!DOCTYPE html> <html> <head> <title>网页标题</title> <meta charset="utf-8"> </head> <body> 网页主体内容 </body> </html> ``` #### 4. HTML 属性 HTML 元素可以包含属性，用于提供额外的信息。例如： ```html <a href="https://www.example.com">访问示例网站</a> ``` - **`href`** 是 `<a>` 标签的一个属性，用于指定链接的目标 URL[^1]。 #### 5. 注释 HTML 中的注释使用 `<!-- -->` 定义，用于解释代码或临时禁用某些代码片段。例如： ```html <!-- 这是一个注释 --> ``` #### 6. 字符编码 为了确保网页正确显示不同语言的字符，通常在 `<head>` 部分设置字符编码为 UTF-8。例如： ```html <meta charset="utf-8"> ``` #### 7. 快速生成 HTML 结构 在现代开发工具（如 VSCode）中，输入 `!` 或 `html:5` 并按 Tab 键即可快速生成标准的 HTML5 文档结构。 --- ###
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值