美文网首页
HTML基本机构与常用标记

HTML基本机构与常用标记

作者: Teow | 来源:发表于2020-04-20 23:51 被阅读0次

    什么是HTML

    HTML的英文全称是`Hyper Text Markup Language,即超文本标记语言,它是Internet上用于编写网页的主要标记语言。

    HTML文件的基本结构

    一个完整的HTML文件由各种元素与标记组成,包括标题、段落、表格和超链接等。下面是一个HTML文件的基本结构。

    <!DOCTYPE html>
    <html>
        <head>
            ...
        </head>
        <body>
            ...
        </body>
    </html>
    

    解析说明

    • <!DOCTYPE html>声明为HTML5文档。
    • <html>元素是HTML页面的根元素,标示HTML文件的起始位置与结束位置。
    • <head>元素包含了文档的元(meta)数据。
    • <body>元素用来指明文档的主体区域,包含了可见的页面内容。

    :在浏览器的页面上使用键盘上的F12开启调试模式,就可以看到组成标签。

    HTML标签

    HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

    • HTML 标签是由尖括号包围的关键词,比如 <html>
    • HTML 标签通常是成对出现的,比如<b></b>
    • 标签对中的第一个标签是开始标签,第二个标签是结束标签。
    • 开始和结束标签也被称为开放标签和闭合标签。

    HTML元素

    HTML 标签" 和 "HTML 元素" 通常都是描述同样的意思.
    但是严格来讲, 一个 HTML 元素包含了开始标签与结束标签,如下实例:
    HTML 元素:

    <p>这是一个段落。</p>
    

    常用HTML标记类型

    常用HTML标记形式分为以下4种:

    1. <标记名称>:单一型,无设置值。例如:<br>
    2. <标记名称 属性="属性值">:单一型,有设置值。例如<hr color="red">
    3. <标记名称>...</标记名称>:对称型,无设置值。例如<title>...</title>
    4. <标记名称 市举行="属性值">...</标记名称》:对称型,有设置值。例如:<body bgcolor="red">...</body>

    常用HTML标记

    标题<hn>...</hn>

    h1h6,作为标题标记,并且依据重要性递减,字号从h1h6由大变小。实例如下:

    <h1>学习标题标记</h1>
        <h2>标记类型</h2>
            <h3>常用标记</h3>
    

    h1一级标题代表重中之重,一般用于网站标题或者头条新闻。
    h2二级标题主要出现在主体内容的文章标题和栏目标题上。
    h3三级标题一般出现在页面的侧柏男篮上。
    页面层级关系不能太深,所以h4、h5、h6一般出现的比较少。

    段落<p>...</p>

    在HTML网页中,使用标记实现一个新段落,语法格式如下:

    <p>段落的内容</p>
    

    p标记有一个属性align能够设置段落中文字的对齐方式,对齐方式分为左对齐、居中和两端对齐,语法格式如下:

    <p align="对齐方式"></p>
    

    其中,align取值为left时,文字显示左对齐;取值为right时,右对齐;取值为center时,居中对齐。

    滚动(marquee)

    marquee标记可以让文字滚动,该标记有滚动方向(direction)、滚动方式(behavior)、滚动次数(loop)、滚动速度(scrollamount)、滚动延迟(scrolldelay)、背景颜色(bgcolor)、宽度和高度等常用属性。语法格式如下:

    <marquee direction="滚动方向" behavior="滚动方式">滚动的文字</marquee>
    

    其中,direction的值有updownleftrigth,默认向左滚动‘behavior的值有scrollslidealternate,分别表示循环滚动、只滚动一次和来回交替滚动;loop的值为整数;scrollamount的值为文字每次移动的长度,以像素为单位;scrolldelay的单位是毫秒。

    相关文章

      网友评论

          本文标题:HTML基本机构与常用标记

          本文链接:https://www.haomeiwen.com/subject/aikeihtx.html