简单的网页结构以及标签的使用

简单的网页结构

下面这串代码是最最简单的网页结构，每个前端网页代码只有一个html标签，所有的网页代码都是编写在标签中间的。

<html><!-- head标签 保存一些与那系信息 它里面的内容，用户是看不到的主要是帮助浏览器编译代码--><head></head><!-- body标签 书写网页的主体内容，所有的给用户看的，都写在body里面 --><body>我的第一个页面</body>
</html>

快速注释

在这里，我们如果需要对代码进行注释，有一个快捷键可以使用，Ctrl键+/进行快速注释

<!-- Ctrl+/可以快速注释 -->

title标签

title标签是标题标签，标签中间编写的是浏览器标题栏显示的标题。
<title>这里写标题</title>

meta标签

meta标签是一个自结束标签，也可以存一些元信息，帮助浏览器编译代码。自结束标签有两种写法如下。其中可以定义一些属性，如：charset是字符集属性，相当于设置一个密码本，设置charset就是为了不出现乱码的情况。
<meta>/<meta />

完整的网页结构

完整的网页结构如下：其中！DOCTYPE是文档申明，表示你自己是按照代码规范来编写代码，需要浏览器也要按照代码规范来编译。

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><!-- 以下代码是响应式开发相关的配置 --><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body></body></html>

实体

1、什么是实体？
在编写网页的时候，有一些字符使我们没办法打出来的，例如空格、大于号，这些字符已经提前被编译器或者浏览器征用，我们不能正常使用，我们要用一些额外的字符代替，这些额外的字符就叫实体
2、实体的语法
&+实体的名称
3、常用的一些实体
参考W3School网站html标签参考网站

img标签

img标签，可以用来引入外部的图片，也是一个自结束标签，它有以下4个属性：
src：引入图片的路径。
alt：是对图片的描述，正常情况下，alt的内容是不显示的，当图片的路径出现问题了，图片引入不成功，alt就会显示。它可以帮助浏览器检索图片，所以我们一定要养成写alt的习惯。
width 设置图片的宽度。
height 设置图片的高度
但是在一般情况下，我们不会同时设置width和height，而是只要单独设置width或者height，另外一个就会自适应调整。

<img src="" alt="" width="" height="">

html的规范

1、html标签有成双成对的，也有自结束标签
2、html中是不区分大小写的，但一般用小写居多
3、标签可以嵌套，但不可以交叉嵌套
4、养成良好的注释的习惯，注释要简洁、明了，注释也不可以嵌套
5、html，css，js都是一种宽泛的语言，它的容错率比较高，它会给你自动纠错，但我们要尽量避免，防止网站的性能有所影响；而且它改的不一定是你想要的

网页代码基本结构以及html标签的使用相关推荐

网页图表Highcharts实践教程之标签组与载入动画
网页图表Highcharts实践教程之标签组与载入动画 Highcharts标签组在图表的大部分元素都提供了标签功能.但很多时候,我们需要额外说明一些信息.这个时候借助原有的图表元素的标签功能就不 ...
网页图表Highcharts实践教程之标签组与载入动画
网页图表Highcharts实践教程之标签组与载入动画 Highcharts标签组在图表的大部分元素都提供了标签功能.但很多时候,我们需要额外说明一些信息.这个时候借助原有的图表元素的标签功能就不是 ...
【重识 HTML + CSS】网页基础知识、基本 HTML 标签
重识 HTML + CSS 网页的基础知识网页的显示过程缓存(cache)技术浏览器内核常用 HTML 元素 DOCTYPE 文档说明 html 元素:根元素 lang 属性 head 元素: ...
写出HTML的基本结构的代码,HTML代码基本结构
使用HBuilderX自动生成的HTML代码框架上图是我新建的一个HTML工程,HTML是一种超文本标记语言,一个完整的网页有很多很多的标签组成,其中的标签大多以成对的形式出现比如,在软件自动生成的 ...
前端笔记(Html+CSS+JS+DOM+网页特效+jQuery+HTML5+CSS3+canvas 标签+web开发重难点+面向对象+AJAX)
第1章Html Html:超级文本标记语言(HyperText Markup Language),在浏览器上运行的一种标记语言. 就是给文本加上含有语义的标签. 接下来应该学习更多具体语义标签: 一. ...
在html语言中段落标签是,HTML的基本结构、段落标签、空格标签、标题标签、图片标签详解...
本次主要给大家介绍下HTML的基本结构.段落标签.空格标签.标题标签.图片标签的用法,用一种相对通俗一点的语言,容易懂的文字让大家快速掌握html.尽量不用或少用专业术语.以下所写的内容希望能帮助到大 ...
vscode——HTML网页的内容添加和部分标签的使用
网页的内容:一般都包含"文字,视频,内容": 1.打印出来网页的基本结构-->html5+tab-->vscode的功能-->用户自定义代码片段 <!DOC ...
网页代码常用小技巧！(2)
网页代码常用小技巧!(2) [转] 41.变换网页的鼠标光标〈BODY style=CURSOR: url(http://203.73.125.205/~liangmi2/farmfrog01.cu ...
html5页面整体布局,HTML5页面布局网页的基本结构
这篇HTML5页面布局我们来学习组成HTML5网页的基本结构都包含了哪些内容,首先先来看下源代码. 欢迎关注头条号/自学编程 hello world 以上就是一个HTML5网页的最基本结构. 下面我们 ...

网页代码基本结构以及html标签的使用

简单的网页结构以及标签的使用