HTML 标签

一、基本结构标签
二、标签语义
- 1、标题标签
- 2、段落和换行
- 3、文本格式化
- 4、盒子
- 5、图像
- 6、路径
- - （1）相对路径
  - - <1>同级路径
    - <2>下一级路径
    - <3>上一级路径
  - （2）绝对路径
- 7、超链接
- - （1）外部链接
  - （2）内部链接
  - （3）空链接
  - （4）下载链接（同路径）
  - （5）网页元素
  - （6）锚点链接

一、基本结构标签

<!DOCTYPE html>                <!--文件声明标签 --><html lang="en">              <!--定义语言为英文-->    <html lang="zh-CN">           <!--定义语言为中文    （一般没有这一行） -->
<head><meta charset="UTF-8">     <!--charset 字符集，UTF-8 意思是全世界都可访问，不会乱码--><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title></title>           <!--标签标题-->
</head>                       <!--标签头部-->
<body>                        <!--标签主体--></body>
</html>                        <!--根标签-->

二、标签语义

1、标题标签

字体会变粗变大，独占一行
共6级从< h1 >到< h6 >

<h1>一级标题</h1>

2、段落和换行

文本会根据浏览器窗口大小自动换行

段落间有间隙

<p>段落标签</p>

写在想要开始换行的位置
单标签

<br/>前端

3、文本格式化

为文字设置粗体、斜体或下划线等

<strong> 加粗   </strong>
<em>     倾斜   </em>
<del>    删除线 </del>
<ins>    下划线 </ins>

4、盒子

用来装内容，没有语义

<div> 大盒子</div>      <!-- 独占一行-->
<span>小盒子</span>     <!-- 一行可放多个-->

5、图像

<img src="图片名+后缀名" alt="文字说明" title="狗子"/>

src：必须要有，指定图像文件的路径和文件名
注：先将图片与网页放在同一文件夹中
alt：当图片显示不出来时，这段文字可以作为说明
title：鼠标放在图片上可显示出狗子

<width="像素"/>     <!-- 宽度-->
<height="像素"/>    <!-- 高度-->
<border="像素"/>    <!-- 加框-->

这三个置用更改一个，其他的会等比例缩放
注：各属性之间要加空格

6、路径

（1）相对路径

<1>同级路径

图片与这次要做的的html 放在同一个文件夹里

<img src="....jpg"/>

<2>下一级路径

图片在正在做的html所在的文件夹里的文件夹里

<img src="文件夹名/....jpg"/>

<3>上一级路径

比如，图片在根目录中，正在做的html在根目录文件夹中的文件夹里

<img src="../....jpg"/>     <!--  ../为上一级符号 -->

（2）绝对路径

这是网路里的图片的地址，如果网站将此图片删除，则该图片也无法显示

<img scr="http://www./2018/"/>

7、超链接

（1）外部链接

跳去别的网站，比如腾讯、百度等

<a href="跳转目标地址"target="目标窗口打开方式">腾讯</a>"http:www.啥啥啥啥"  "_self   当前窗口打开"" _blank   新窗口打开"

（2）内部链接

网站内各页面相互跳转

<a href="indel.html">首页</a>

（3）空链接

如果跳转的页面还没做好，可以用空链接代替

<a href="#">首页</a>  <!-- #为空链接 -->

（4）下载链接（同路径）

如果要跳转到一个压缩包或者是要下载的文件

<a href="压缩包名">下载文件</a>

（5）网页元素

点后面的图片，跳到前面的网站

<a href="http://网页名"><img src="img.jpg"/></a>

（6）锚点链接

点链接可以快速去往页面中的对应位置，例如：生平经历

<a href="#live">生平经历</a>
<h4 id="live">生平经历</h4>

HTML 标签（HTML超文本标记语言）相关推荐

超文本标签语言html的主要特点,福建教师招考整理：超文本标记语言（HTML）
HTML即超文本标记语言,HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字.图形.动画.声音.表格.链接等.下面是小编整理的知识点--超文本标记语言(HTML),以供各位考生参考 ...
html 标准通用标记语言下,HTML超文本标记语言常用的一些标签
在之前的学习中了解到了xml是可扩展型标记语言,所以html和xml有相似之处,html是可以在网络上传输的超文本标记语言,所以xml的所有要求对于html同样适用,单双标签,子标签,属性,之类的ht ...
HTML - 超文本标记语言 (Hyper Text Markup Language)
HTML - 超文本标记语言 (Hyper Text Markup Language) HTML是建设网站/网页制作主要语言. HTML是一种易于学习的标记语言. HTML使用像 <p> ...
超文本标记语言HTML
介绍html文档的基本结构,html常用标签的使用,理解html语言制作网页基本原理. html概述和基本结构 html概述 HTML是 HyperText Mark-up Language 的首字母 ...
HTML 为啥称“超文本标记语言”？
作者 | 泰斗贤若如责编 | 伍杏玲出品 | CSDN(ID:CSDNnews) 在学习一门编程语言之前,了解它的特性,带着对特性的好奇和疑问去学习是最快最好的学习方法.就像你知道某个地方有很多宝 ...
超文本标记语言是指Java_超文本标记语言(HTML)
超文本标记语言(HyperText MarkUp Language,HTML) HTML是用来制作网页的标记语言,HTML不需要编译,直接由浏览器解析: HTML文件是一个文本文件,包含了一些HTML ...
HTML(超文本标记语言)
目录 1.HTML的作用: 2.文档结构: 3.基础标签: 4.字符实体: 5.五大主流浏览器: 1.HTML的作用: 是专门给文本添加语义的,而不是修改文本形式,这些用于描述其他文本语义的文本,我们 ...
python---Web前端HTML(超文本标记语言)
文章目录 Web前端开发介绍 Web概述 Web起源 Web的特点 Web工作原理 URL介绍 HTML网页结构 HTML基本结构 HTML文档规范与注释 HTML标签文本标签列表标签图片标签i ...
Web前端—01HTML超文本标记语言
文章目录一.Wed前端开发介绍 1.Web概述 2.Web起源 3.Web的特点 4.Web工作原理 5.URL介绍二.HTML网页结构 1.HTML介绍 2.HTML基本结构 3.文档类型 4. ...
python进阶之web前端（01—HTML超文本标记语言）
目录 01.Web前端开发介绍 1.Web前端开发概述 2.Web起源 3.Web特点 4.Web工作原理 5.URL介绍 02.HTML网页结构 1.HTML基本结构 2.HTML文档类型 3.HT ...

HTML 标签（HTML超文本标记语言）

HTML 标签

一、基本结构标签

二、标签语义

1、标题标签

2、段落和换行

3、文本格式化

4、盒子

5、图像

6、路径

（1）相对路径

<1>同级路径

<2>下一级路径

<3>上一级路径

（2）绝对路径

7、超链接

（1）外部链接

（2）内部链接

（3）空链接

（4）下载链接（同路径）

（5）网页元素

（6）锚点链接

HTML 标签（HTML超文本标记语言）相关推荐

最新文章

热门文章

HTML 标签 （HTML超文本标记语言）

HTML 标签

一、基本结构标签

二、标签语义

1、标题标签

2、段落和换行

3、文本格式化

4、盒子

5、图像

6、路径

（1）相对路径

<1>同级路径

<2>下一级路径

<3>上一级路径

（2）绝对路径

7、超链接

（1）外部链接

（2）内部链接

（3）空链接

（4）下载链接（同路径）

（5）网页元素

（6）锚点链接

HTML 标签 （HTML超文本标记语言）相关推荐

最新文章

热门文章

HTML 标签（HTML超文本标记语言）

HTML 标签（HTML超文本标记语言）相关推荐