html常用标签详解

14次阅读

共计 1040 个字符,预计需要花费 3 分钟才能阅读完成。

HTML 注释及 CSS 代码注释

<!-- 这是 html 的注释 -->
/* 这是 CSS 的注释 */

网页结构代码

<!DOCTYPE html> <!-- 声明文档类型 html5-->
<html lang="en"> <!-- 中文为 zh-CN--><!-- 展示网页内部所有内容 -->
    <head><!-- 网页头部标签 给游览器和搜索引擎查看 -->
    <!--meta 标签被称为元数据,作用是专门告诉浏览器或是搜索引擎关于网页的一些基本数据 -->
        <meta charset="UTF-8"> 显示字符集
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="keywords" content=""> 关键词
        <meta name="description" content=""> 描述信息
        <title> 我是一个标题文字 </title>
    </head>
    <body><!-- 用户看到的所有数据 -->
    </body>
</html>

常用 lang:

en-US 英语(美国)zh-CN 中文(简体中国大陆 )
zh-SG 中文(简体,新加坡)h-HK  中文(繁体,香港)zh-MO 中文(繁体,澳门)zh-TW 中文(繁体,台湾)

a 标签

可选值:

href 
    #号返回顶部
    id 号去到相应的 id 名处
    相对路径到相应内部页面
    外网地址链接到相应的网址
target
    _self 默认值,当前页面打开
    _blank 打开一个空白页面来显示
    _new   打开一个新页面,如果已存在则不打开新页面 

占位符:

# 缺点会返回顶部
javascript:;

img 标签

可选值

src 路径地址
    相对地址 常用使用方法
    绝对地址 不建议项目中使用
    都是从当前目录来计算路径
alt 图片加载失败时候的文字显示
title  鼠标悬停的提示文字
width/height 建议写上原始大小,不写单位,默认是 px
    只写宽,会等比例缩放 

常用图片格式
jpegdpg)

 支持的颜色丰富,不支持透明效果,不支持动图,有损
——般用来显示照片 

gif

 支持的颜色比较少,支持简单透明,支持动图
颜色单一的图片,动图 

png

 一支持的颜色丰富
复杂透明的图片(专为网页而生的,适合图标,)

webp

 这是谷歌专门推出来表现网页中的图片的一种格式一它具备所有图片的优点,而且文件还特别小
缺点:兼容性不好 

base64

 一将图片使用 base64 进行编码,这样可以直接将图片直接转换为字符. 通过字符的形式引入图片
——般都是一些需要和网页一起加载的图片才会使用 base64

原则:效果一样,用小的

正文完
 0