html常用标签,HTML入门

HTML : Hyper Text Markup Language 超文本标记语言

超级文本标记语言文档制作不是很复杂,但功能强大,支持不同数据格式的文件镶入其主要特点如下:

  1. 简易性:超级文本标记语言版本升级采用超集方式,从而更加灵活方便。

  2. 可扩展性:超级文本标记语言的广泛应用带来了加强功能,增加标识符等要求,超级文本标记语言采取子类元素的方式,为系统扩展带来保证。

  3. 平台无关性:虽然个人计算机大行其道,但使用MAC等其他机器的大有人在,超级文本标记语言可以使用在广泛的平台上,这也是万维网WWW)盛行的另一个原因。

  4. 通用性:另外,HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面,这些页面可以被网上任何其他人浏览到,无论使用的是什么类型的电脑或浏览器。

下面简单介绍一下HTML中几种常用的标签

<!--html表示HTML文档的开始-->
    <!--head 标记网页头部信息 例如字符编码、引入文件、视口设置....-->
        <!--charset 设置字符编码 一定要写在head标签下的第一个位置
        UTF-8 国际通用编码
        acsii   GBK GB2312 ...
        -->

下面先以代码的形式介绍一下html中各种常用标签的用法(看注释和运行结果)

<!DOCTYPE html>
<!--doc document type html
html5 最新声明方式 在网页加载时,完全按照HTML5新标准来进行解析和加载
-->
<html>
    <head>
        <!--meta 单标签 用来引入或声明一些内容-->
        <meta charset="UTF-8">
        <!--title 标题标签-->
        <title>这是网页标题</title>
    </head>
    <!--body 标记网页主题信息-->
    <body>
        <!--h1~h6 标题标签-->
        <!--标签独自占一行空间,称之为块元素-->
        <h1>我是h1 我最大</h1>
        <h2>我是h2</h2>
        <h6>我是h6 我最小</h6>
        <!--span 用来标记普通文本-->
        <!--标签可以在一行内进行连续展示,不单独占一行,称之为行元素-->
        <span>我是span 用来标记普通文本 </span>
        <span>我可以在一行内进行连续展示,不单独占一行</span>
        <!--<p> 标签定义段落。-->
        <p>p 元素会自动在其前后创建一些空白。浏览器会自动添加这些空间,您也可以在样式表中规定。</p>
        <!--a标签  超链接标签-->
        <!--url:https://www.baidu.com/ url:统一资源定位符 -->
        <!--target="_blank" 新开一个窗口,打开目标地址-->
        <a href="https://www.baidu.com/" target="_blank">百度一下,你就上当</a>
        <!--img 标记网页中的图片-->
        <!--src source 图片来源-->
        <!--alt alter 当图片未被加载出来时,以文本方式代替图片显示-->
        <!--title 当鼠标停留在图片上时,展示的文本-->
        <!--width 设置图片显示宽度,高度会自适应-->
        <img src="1.jpg" alt="烤红薯.jpg" width="500" title="你想吃吗?">

        <!--div 块元素 标记网页中的一块区域-->
        <div>你好,我是div,我是一个块元素,所有不属于div包裹的内容,都要另起一行!</div>
        <!--section 组件、模块-->
        <section>你好,我是section,我是一个块元素,所有不属于div包裹的内容,都要另起一行!</section>
        <!--table 表 块元素-->
        <table>
            <!--caption 表标题-->
            <caption>caption是表标题</caption>
            <!--tr 标记表格当中的一行-->
            <tr>
                <!--th 标记表头中的单元格-->
                <th>表头1</th>
                <th>表头2</th>
                <th>表头3</th>
            </tr>
            <tr>
                <!--td 标记表内容的单元格-->
                <td>内容1</td>
                <td>内容2</td>
                <td>内容3</td>
            </tr>
            <tr>
                <td>内容1</td>
                <td>内容2</td>
                <td>内容3</td>
            </tr>
        </table>
    </body>
</html>
<!--html文档的结束-->

运行结果如下

以上知识掌握之后,就可以简单的学习一下css样式基础的内容了,在之后的学习中,我们也可以随着练习掌握更多的标签用法

猜你喜欢

转载自blog.csdn.net/A_fool_Program_ape/article/details/81393913