美文网首页让前端飞
html的介绍及常用标签

html的介绍及常用标签

作者: 前端萧萧 | 来源:发表于2020-12-03 18:31 被阅读0次

    什么是HTML?

    HTML: ( Hypertext Markup Language )超文本标记语言,是一种标识性的语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。

    特点:

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

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

    • 平台无关性:虽然个人计算机大行其道,但使用MAC等其他机器的大有人在,超级文本标记语言可以使用在广泛的平台上;

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

    HTML的基本结构:

    HTML文档结构基本由以下四部分组成:

    (1)文档声明:标志是:<!DOCTYPE HTML> ,声明这是一个HTML文档。

    (2)html标签对:标志是:<html></html> ,标签的作用相当于程序在告诉网页浏览器,整个网页是从<html>这里开始的,然后到</html>结束。

    (3)head标签对:标志是:<head></head>,head标签是页面的头部。

    (4)body标签对:标志是:<body></body>,body标签是页面的身体,一般网页绝大多数的标签代码都是在这里进行编写。

    常用标签:

    <div>标签和<span>标签:

    <div> 和 <span> 是没有语义的,它们就是一个盒子,用来装内容的。

    <div> 这是div标签 </div>
    <span> 这是span标签 </span>
    

    特点:
    1)<div> 标签用来布局,但是现在一行只能放一个<div>。
    2)<span> 标签用来布局,一行上可以多个 <span>。

    图像标签

    在 HTML 标签中,<img> 标签用于定义 HTML 页面中的图像。

    <img src="图像URL" />
    

    img 是单词 image 的缩写,意为图像。src 是<img>标签的必须属性,它用于指定图像文件的路径和文件名。

    代码示例:

        <img src="./img/1.gif" alt="松鼠">
    

    <img> 标签必需的属性:

    alt:规定图像的替代文本。
    src:规定显示图像的 URL。

    url可以使用绝对路径或者相对路径:

    • 绝对路径:是指目录下的绝对位置,直接到达目标位置,通常是从盘符开始的路径。
    • 相对路径:是从代码所在的这个文件出发,去寻找目标文件的,而我们这里所说的上一级 、下一级和同一级就是 图片相对于 HTML 页面的位置。
    <!-- 相对路径写法 -->
    <!-- ./ 表示当前文件所在目录,即G:/images/ -->
    <!-- ./可省略不写 -->
    <img src = "logo.png"/>
    <img src = "./logo.png"/>
    
    <!-- ../ 表示当前文件所在目录的上级目录,即G:/ -->
    <img src = "../images/logo.png"/>
    
    <!-- /表示根路径,即G:/ -->
    <img src = "/images/logo.png"/>
    

    <img> 常用属性:

    • align : 规定如何根据周围的文本来排列图像。
    • border : 定义图像周围的边框。
    • height:定义图像的高度。
    • width:设置图像的宽度。

    超链接

    超链接可以让我们从一个页面跳转到其他页面,或者是当前页面的其他的位置.

    超链接的语法格式:

    <a href="跳转目标" target="目标窗口的弹出方式"> 文本或图像 </a>
    

    常用属性:

    • href:URL 规定链接指向的页面的 URL。
    • hreflang:规定被链接文档的语言。
    • rel:规定当前文档与被链接文档之间的关系。
    • target:规定在何处打开链接文档。
    • type:规定被链接文档的的 MIME 类型。

    链接分类:

    外部链接:
    例:

     < a href="http:// www.baidu.com"> 百度</a >。
    

    内部链接:网站内部页面之间的相互链接. 直接链接内部页面名称即可,

    例:

     < a href="index.html"> 首页 </a >。
    

    相关文章

      网友评论

        本文标题:html的介绍及常用标签

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