专注Java教育14年 全国咨询/投诉热线：400-8080-105
动力节点LOGO图
始于2009，口口相传的Java黄埔军校
首页 hot资讯 常用HTML语法概述

常用HTML语法概述

更新时间：2021-02-19 16:52:00 来源：动力节点 浏览981次

众所周知，学习一门语言，最重要的还是要掌握其语法，HTML也不例外。作为一门超文本标记语言，HTML是一种标准，也是一种规范，它通过标记符号来标记要显示的网页中的各个部分。掌握常用HTML语法是我们学习HTML的基本要求，下面我们就来为大家讲述HTML语法。

1、<常规标记>

<标记 属性=“属性值” 属性=“属性值”></标记>

标记也可叫标签或叫元素

例如：<head></head>

2、空标记

<标记 属性=“属性值” />

例如：<meta charset=”utf-8”>

3、文本标题（h1-h6）

<h1>LOGO</h1>

<h2>二级标题</h2>

<h3>三级标题H3</h3>

<h4>四级标题H4</h4>

<h5>五级标题</h5>

<h6>六级标题</h6>

注：文本标题标签自带加粗，有自己的文本大小，并且独占一行，有默认间距

4、段落文本(p)

<p>段落文本内容</p>

标识一个段落(段落与段落之间有段间距)

5、空格

所占位置没有一个确定的值,这与当前字体字号都有关系.

6、换行(br)

<br />

换行是一个空标记(强制换行)

7、水平线

<hr />空标记

8、加粗有两个标记

A、<b>加粗内容</b>只是显示加粗

B、<strong>强调的内容</strong>突出的文本

9、倾斜

<em>强调文本</em>

<i>倾斜文本</i>

10、扩展

<u>文本</u>下划线

<del>文本</del>删除线

<s>文本</s>删除线

<sub></sub>下标

<sup></sup>上标

11、列表(ul,ol,dl)

HTML中有三种列表分别是：无序列表，有序列表，自定义列表

*无序列表

无序列表组成：

<ul>(unordered list)

<li></li>

<li></li>

．．．．．．

</ul>

*有序列表

有序列表组成：

<ol>(ordered list)

<li></li>

<li></li>

．．．．．．

</ol>

*自定义列表

<dl>(definition list)

<dt>名词</dt>

<dd>解释</dd>

(definition description)

．．．．．．

</dl>

12、插入图片

<img src="目标文件路径及全称" alt="图片替换文本" title="图片标题" width="宽度" height="高度"/>

注:所要插入的图片必须放在站点下

title的作用:图片的标题； 在你鼠标悬停在该图片上时显示一个小提示，鼠标离开就没有了，HTML的绝大多数标签都支持title属性，title属性就是专门做提示信息的

alt的作用:提示文本 必写；alt属性是在你的图片因为某种原因不能加载时在页面显示的提示信息，它会直接输出在原本加载图片的地方。（优化图片的）

*相对路径的写法：

1)当当前文件与目标文件在同一目录下，直接书写目标文件文件名+扩展名；<img src=”q12.jpg”/>

2)当当前文件与目标文件所处的文件夹在同一目录下，写法如下：

文件夹名/目标文件全称+扩展名；<img src=”images/q12.jpg”/>

3)当当前文件所处的文件夹和目标文件所处的文件夹在同一目录下，写法如下：

../目标文件所处文件夹名/目标文件文件名+扩展名；

<img src=”../images/q12.jpg”/>

13、超链接的应用

语法：

<a href="目标文件路径及全称/连接地址" title="提示文本">链接文本/图片</a>

<a href="#"></a>空链接

属性：target:页面打开方式，默认属性值_self。

属性值：_blank 新窗口打开

<a href="#" target="_blank">新页面打开</a>

14、数据表格的作用及组成

作用：显示数据

表格组成

<table width="value" height="value" border="value">

<tr>

<td></td>

<td></td>

</tr>

</table>

注：一个tr表示一行;一个td表示一列(一个单元格)

15、表单的作用及组成

表单的作用：用来收集用户的信息的;

表单组成：表单框（表单域form）

提示信息

表单控件/表单元素

1)、表单框

<form name="表单名称（英文字母开头的）" method（提交方式）="post/get" action="表单提交的地址"></form>

2）文本框

<input type="text" value="默认值" placeholder="提示文本" />

3)密码框

<input type="password" placeholder="密码"/>

4)提交按钮

<input type="submit" value="按钮内容" />

<input type="reset" value="按钮内容"/>重置按钮

5）单选框/单选按钮

<input type="radio" name="ral" value="radiovalue"/>

<input type="radio" name="ral" checked="checked" />

单选按钮里的name属性必须写，同一组单选按钮的name属性值必须一样。

6）复选框

<input type="checkbox" name="like" value="checkboxvalue" />

复选按钮里的name属性必须写，同一组复选按钮的name属性值必须一样。

checked="checked"表示默认被选中，可简写成checked

disabled="disabled"表示禁用，可简写成disabled

enabled:可用状态

7)下拉菜单

<select name="">

<option name="" value="表单被提交时被发送到服务器的值">菜单内容</option>

</select>

8）多行文本框（文本域）

<textarea name="textareal" cols="字符宽度" rows="行数">

</textarea>

9)跳转按钮

<input name="'" type="button" value=“按钮内容” />

<button></button>

16、div和span的用法

<div ></div>

没有具体含义， 除了独占一行之外没有任何其它的默认属性，是页面布局中常用的标签；

<span> </span>

文本结点标签

可以是某一小段文本，或是某一个字。 它除了不换行外，没有任何其它的默认属性；

以上就是为大家总结的常用的HTML语法，当然，HTML作为前端开发的得力语言，HTML语法总体体量也是很庞大的，我们还有许多没有做详细的介绍。在本站的HTML教程中，还有许多本文中未涉及到的HTML语法，并配备了具体实例应用，感兴趣的小伙伴一定要去学习哦。

HTML教程
上一篇详解二叉查找树操作 下一篇简述6种HTML空格实体

相关阅读

最新文章

  • 男 女

提交申请后，顾问老师会电话与您沟通安排学习

课程大纲 学习路线 毕业设计 开发工具
免费课程推荐 >>
技术文档推荐 >>
  • Java培训班
  • 热点话题
  • 城市分站
  • 资源广场
  • 热门专题
Java培训实验班 Java培训就业班 Java培训夜校班 Java培训在职加薪班 Java培训架构师班 Java培训课程
Java培训动态 零基础学Java Java职场就业
北京Java培训 广州Java培训 深圳Java培训 上海Java培训 武汉Java培训 成都Java培训 西安Java培训 郑州Java培训 南京Java培训 长沙Java培训
Java书籍 Java视频教程 Java毕业设计 Java面试题 Java API文档 Java开发工具 Java在线学习
上海java培训 北京java培训 深圳java培训 广州java培训 武汉java培训 成都java培训 西安java培训 郑州java培训 南京java培训 长沙java培训 java线上培训班
更新时间：2024-05-07 03:21:42 免费电话：400-8080-105 备案号：京ICP备09027468号 京公网安备 11030102010736号