HTML5基础

最新推荐文章于 2022-07-11 22:06:11 发布

原创最新推荐文章于 2022-07-11 22:06:11 发布 · 259 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Web前端

HTML5 专栏收录该内容

6 篇文章

订阅专栏

一、HTML5的基本标签

1.HTML5是什么？

HTML5是HTML的升级版，是可以用来描述网页中的一种语言，是一种超文本标记语言，它不是编程语言，只是一种标记语言。

2.诞生时间

1993年6月第一版HTML语言草案发布，2014.10.28 HTML5发布。

3.HTML5基本组成机构：

<!DOCTYPE html>    <!--声明HTML语言-->
<html lang="en">
<head>
    <meta charset="UTF-8">     <!--指定编码集-->
    <title>标题</title>        <!--标题部分，可有可无-->
</head>                        <!--头部部分，必须有-->
<body>                         <!--主体部分，写代码的-->
  我的第一个网页                 <!--具体代码-->
</body>
</html>                          <!--html文件-->

4.html的基本标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <!--h1~h6标签，p标签，hr，br都是独占一行，也是块元素，其他的是行内元素-->
    <h1>文字</h1>
    <h2>文字</h2>
    <h3>文字</h3>
    <h4>文字</h4>
    <h5>文字</h5>
    <h6>文字</h6>
    <p>一段文字</p>
    <strong>让字体变粗</strong>
    <em>让字体倾斜</em>
    强制换行<br/>
    下划线<hr>
</body>
</html>

5.特殊符号

<!--&nbsp；是空格，&gt;大于符号，&lt；小于符号，&quot；单引号，&copy;版权符号-->
    <p>这是&nbsp;一段文字</p>
    <p>这是&lt;一段&gt;文字</p>
    <p>这是&quot;一段&copy;文字</p>

6.常见的图片格式：

JPG,GIF,BMP,PNG等。

图像标签的基本语法：


<!--src是图像路径，alt是图像的替代文字，title是鼠标悬浮在图像上面的文字，
width是宽度，height是图像高度-->
<img src="image/tupian.jpg" alt="这是一个图片" title="tupian" height="100px" width="100px"/>


注意:这里的图像选择路径的时候，要选择到相对路径，也就是当前对象所在的位置，如：image/tupian.jpg

二、超链接，锚链接的基本用法

1.超链接语法：

<a href="链接地址" target="目标地址"></a>

其中：
       href是路径
       traget是链接在哪个窗口打开，常见的有：
       _self是自身窗口，_blank是新建窗口

注意：超链接可以是文本超链接，也可以是图像超链接。

2.锚链接语法：

<a name="marker">目标位置A</a>

<a href="#marker">当前位置B</a>

其中：name是设置名字，href是要打开的窗口名字

三、行内元素和块元素

1.行内元素：如strong，a元素等，宽度由自己决定，不会换行

2.块元素：如p元素，h1~h6元素等，独占一行

HTML5基础

1993年6月第一版HTML语言草案发布，2014.10.28 HTML5发布。

JPG,GIF,BMP,PNG等。

区分：行内元素由内容撑开宽度，左右内容可以并排一行。块元素是自己独占一行！