第一章HTML5基础

奋怒的少年猪猪

已于 2023-09-06 11:05:09 修改

阅读量56

点赞数

分类专栏： HTML5基础和CSS基础文章标签： html5

于 2023-05-30 08:41:28 首次发布

本文链接：https://blog.csdn.net/ddd_22/article/details/130940556

版权

HTML5基础和CSS基础专栏收录该内容

9 篇文章 0 订阅

订阅专栏

一、什么是HTML

Hyper Text Markup Language(超文本标记语言)
超文本标记语言包括：文字、图片、视频、音频等

二、W3C标准

1.W3C

World Wide Web Consortium（万维网联盟）
成立于1994年，Web技术领域最权威和具影响力的国际中立性技术标准机构
http://www.w3.org/
http://www.chinaw3c.org/

2.W3C标准包括

结构化标准语言（XHTML 、XML）
表现标准语言（CSS）
行为标准（DOM、ECMAScript ）

编写HTML5文档时，为什么要遵守W3C标准？

确保多个浏览器兼容
三、HTML网页基本结构

<html>
    <head></head>
    <body></body>
    等成对的标签，分别叫开放标签和闭合标签
    单独呈现的标签（空元素），如” < hr />”  ；意为用  /  来关闭空元素
</html>

四、网页基本信息

<!DOCTYPE html>
 告诉浏览器使用什么规范,可省但建议
<head><meta charset="utf-8"/></head>
    charset:字符集
        UTF-8:国际通用字符集
        ISO-8859-1:纯英文
        GB2312、GBK:简体中文
        BIG5:繁体

五、标签

<!--描述：块元素 -->
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
<p>段落标签</p>
<span>段落标签</span>
<!--描述：行内元素-换行 -->
<br />
<!--描述：块元素-水平线-->     
<hr />
<!--描述：特殊符号-->
<p>空格&nbsp;</p>
<p>大于号&gt;</p>
<p>小于号&lt;</p>
<p>引号&quot;</p>
<p>版本号&copy;</p>
<!--描述：行内元素 -->
<strong>加粗</strong>
<b>加粗</b>
<em>斜体</em>
<i>斜体</i>
<br />
<!--描述：行内元素-图像标签
    绝对路径:指向目标地址的完整描述，一般指向本站点外的文件
    相对路径:相对于当前页面的路径，一般指向本站点内的文件
    父级:  ../
    父级的父级:  ../../
    下一级:  \ -->
 <img src="路径" alt="占位符，图片未正常显示提示的文字"  title="图片标题" width="50px" height="50px"/> 
<!--描述：行内元素-超链接
    href="超链接地址"
    target:指定链接在哪个窗口打开 
        值:     _self自身页面
                _blank新增一个空白页面
     href="#":空链接 -->
<a href="https://www.baidu.com" target="_blank">超链接</a>
<a href="mailto:123@123.com">功能性链接:发送邮件给mailto:后的邮箱地址</a>
<a href="#标记位置">页面间链接</a>
<a href="其他页面#标记位置">锚链接</a>

在这里插入图片描述

六、常见的图像格式

JPG(JPEG)【Joint Photographic Experts Group】联合图像专家组
在Internet上被广泛支持，有损压缩，压缩后体积小，会造成图像失真，适用于摄影或连续色调图像的高级格式。
GIF【Graphics Interchange Format】图像交换格式
在网页中使用广泛、普遍，支持透明色、动画。
PNG【Portable Network Graphic Format】流式网络图形格式
兼有GIF和JPG格式的优势
BMP【Bitmap】位图
在Windows操作系统中使用较多，与其他Microsoft Windows程序兼容，不支持文件压缩，也不适用于Web页