这篇文章主要讲解了“HTML常用的基础标签有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“HTML常用的基础标签有哪些”吧!
HTTP基础语法
div标签是块级结构布局元素,因此结合css盒模型讲解。
HTTP基本结构
基本结构标签
HTTP文件包括头部信息和网页内容,body中的内容在网页中显示。
< html>
< head>
< title>标题< /title>
< /head>
< body>
网页主体内容
< /body>
< /html>
标签、元素、属性
标签分为双标签和单标签。
< html>...< /html>
< hr/>
元素是指从开始到结束标签的全部内容,例如,html标签加上内部代码,即为一个HTML元素。
属性用来修饰标签。
< 标签名 属性1="值1" 属性2="值2">内容< /标签名>
注释
注释格式
< !-- 注释 -->
文档声明
声明必须放在HTML稳定第一行,但是并不是HTML标签。
< !DOCTYPE html>
网页编码
编码在head标签内部设置。
< meta charset="UTF-8">
< meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
文字和段落标签
标题标签h2–h7
< h2>一级标题< /h2>
段落标签p
align属性:值有left、right、center、justify。p标签中空格是不起作用的,需要使用代码nbsp
< p>段落< /p>
< p align="left">段落< /p>
换行标签br和水平线标签hr
< br/>
< hr/>
< hr width="10"/>
< hr color="blue"/>
< hr align="center"/>
< hr noshade=""/>
预标签pre很少用。
修饰标签和特殊符号
文字修饰标签
i和em:斜体
b和strong:加粗
sub:下标
sup:上标
ins:下划线
del:删除线
特殊符号
空格
< 小于/左尖括号 > 大于/右尖括号
® 已注册R
© 版权C
™ 商标TM
示例
< p align="center">关于我们 | 招聘信息 | 联系我们 | 意见反馈< /p>
< hr/>
< p align="center">Copyright©2016 awecoder.com All Rights Reserved< /p>
< p>公式:x2+x=0 解:x< sub>1< /sub>=0;x< sub>2< /sub>=-1< /p>
列表标签
无序列表ul
属性type可为disc(原点)、square(方块)、circle(空心圆)。
< ul type="circle">
< li>列表项< /li>
< li>列表项< /li>
< /ul>
有序列表ol
属性type可为1、a、A、i、I。
< ol type="A">
< li>列表项< /li>
< li>列表项< /li>
< /ol>
定义列表
dt和dd在dl标签内,dt和dd同级。
< dl>
< dt>配送方式< /dt>
< dd>上门自提< /dd>
< dd>海外配送< /dd>
< dt>支付方式< /dt>
< dd>货到付款< /dd>
< dd>在线支付< /dd>
< /dl>
图像标签img
src属性=图片URL(相对路径是图片相对于当前html文件的路径)
alt属性=图像的代替文字,图像无法显示时展示。
height属性和width属性,可用像素数值和百分比表示。
也适用align对齐属性。
< img src="Snipaste.png" alt="截图" height="50%" width="50%"/>
< img src="Snipaste.png" alt="截图" height="50px" width="50px"/>
超链接a和定义锚点
超链接标签a
href属性为链接地址,标签内容可以是文字或图片等。
target属性–链接的目标窗口,_self当前窗口打开,_blank新窗口打开,_top/_parent
title属性–链接提示文字。
name属性–链接命名。
< a href="http://www.baidu.com" target="_blank" title="百度搜索">百度< /a>
空连接--点击没有反应
< a href="#" title="百度">百度< /a>
空的链接--点击刷新页面
< a href="">刷新页面< /a>
id属性–书签标记
结合name属性定义锚点
< a href="#锚点名">同一个页面< /a>
< a href="网页名称#锚点名">不同页面< /a>
< a name="锚点名">内容< /a>
示例
< a name="top">目录< /a>< br/>
< a href="#fruit">水果< /a>< br/>
< a href="#vegetable">蔬菜< /a>< br/>
< a href="#sport">运动< /a>
< !--设置水果标题-->
< h4>水果< /h4>
< a name="fruit">< /a>
< ul>
< li>香蕉< /li>
< li>苹果< /li>
< /ul>
< a href="#top">返回顶部< /a>
< !--设置蔬菜标题-->
< h4>蔬菜< /h4>
< a name="vegetable"/>
< ul>
< li>西红柿< /li>
< li>黄瓜< /li>
< /ul>
< a href="#top">返回顶部< /a>
链接扩展功能
邮箱
< a href="mailto:xxx@qq.com" >xxx@qq.com< /a>
下载文件
< a href="下载地址">文件下载< /a>
感谢各位的阅读,以上就是“HTML常用的基础标签有哪些”的内容了,经过本文的学习后,相信大家对HTML常用的基础标签有哪些这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是亿速云,小编将为大家推送更多相关知识点的文章,欢迎关注!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。