HTML-基础与常用标签

5个月前发布 SanS三石

29 0 0

一、HTML基础语法

HTML

HTML是Hypertext Markup Language（超文本标记语言）的缩写，是一种基于SGML（标准通用标记语言）的标记语言，是Web用于编辑网页的主要工具。

纯文本和超文本

纯文本：没有任何的修饰,只能保存文字内容，有利于网络传输，可以通过修改后缀命。
超文本：用于连接另一个链接，文本，多媒体。

标记

也叫标签写给浏览器的一种语法格式。

语义化网页的优势

便于浏览器阅读，解析。以及后期维护。便于爬虫抓取需要的数据。

THTML规范

W3C 万维网联盟，发布和维护互联网的规范和标准。

标签语法

必须书写在一对尖括号<>内。
分单标签和双标签，双标签成对存在。
需要有结束符，H5后单标签可以不写结束符。

HTML元素

开始标签到结束标签的所有内容。
标签之间可以嵌套。
元素对空白换行不敏感。

标签级别：

容器级：可以嵌套其它所有的标签。
文本级：只能嵌套文字/图片/超链接。

html标签可以添加属性

书写必须在开始标签或单标签内，和标签名用空格分开。
键值对写法：key:value value包裹在双引号内。多个属性用空格分开。

HTML基本结构

html 最大的标签，文件的根元素。
head 头部，内部用于对网页的设置，除了title其它都不显示，title必须要写。
title 标题。提高搜索排名。浏览器收藏夹的标题。尽量精简。
body 主体。存放所有html用来显示的标签。
字符集：mate定义当前网页所使用的字符编码。

<head><!--头部，对网页的设置-->
        <meta charset="UTF-8"><!-- 定义字符编码 -->
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>html常用标签</title><!--标题-->
    </head>
    <body><!--主体，网页的书写内容-->

    </body>

路径：

相对路径：同级，子级，上级。
绝对路径：直接从电脑盘符出发查找，路径不可移植。

二、常用标签

标题标签：

h1-h6 分别定义六个级别的标题，h1权重最大，依次减小。一般一个页面只写一个h1，重复出现反而降低权重。
标题标签不能互相嵌套，进行同级书写。

<h1>标题1</h1>
    <h2>标题2</h2>
    <h3>标题3</h3>
    <h4>标题4</h4>
    <h5>标题5</h5>
    <h6>标题6</h6>

段落标签和换行标签：

p 段落标签，只能存放文本，图片，表单，或者废弃的font标签用来添加一段完整的语义。
br 换行标签。

<p>用来添加一段语义完整的文字</p>
    <br/>

文本格式化标签:

<b>粗体</b>
    <i>斜体</i>
    <em>强调文本</em>
    <sup>上标标签</sup>
    <sub>下表标签</sub>
    <small>小号字体</small>

图像标签:

src:图片查找路径。分相对路径和绝对路径。
width:宽度，height:高度。只设置一个，另一个等比缩放。两个都设置，按设置值变化。
border 边框。title 提示文本,鼠标停留时提示信息。alt 替换文本,图片加载失败时,替换提示。

<img src="img/小丑.jpg" alt="加载失败提示" width="100px" height="" title="鼠标停留提示">

音频标签和视频标签：

src 路径。consrols 控制条。

<audio src="img/mp3.mp3" controls></audio>
    <video src=""></video>

超链接：

a标签，在指定位置添加超级链接。
属性:

href：超文本引用，用于规定链接的目标地址。
title 提示文本，鼠标停留时提示

免责声明 本站提供的一切软件、教程和内容信息仅限用于学习和研究，不得用于商业或者非法用途，否则，一切后果请用户自负；本站信息来自网络收集整理，版权争议与本站无关，您必须在下载后的24个小时之内，从您的电脑或手机中彻底删除相应的内容；如果您喜欢该内容，请支持正版，得到更好的服务；我们非常重视版权问题，如有侵权请与我们联系，敬请谅解！邮箱：sanshi@sanshi.link