本文摘自PHP中文网,作者php中世界最好的语言,侵删。
这次给大家带来HTML入门必知,HTML入门必知的注意事项有哪些,下面就是实战案例,一起来看一下。一、简介
1、超文本标记语言(Hyper Text Mark Language),是一种创建网页的标准标记语言,由浏览器来解析。
2、文档后缀名为.html或htm,html文件也叫web页面;
3、HTML中不支持空格、回车、制表符,它们都会被解析成一个空白字符;
4、HTML标签通常是成对出现的,格式:<tagName>data</tagName>;
5、只有<body> </body>标签内的内容才会在浏览器中显示;
6、HTML语言不区分大小写;
7、<!--注释-->
8、helloworld!
1 2 3 4 5 6 7 8 9 10 | <!DOCTYPE html> <!--声明HEML版本-->
<html>
<head>
<meta charset= "utf-8" > <!--声明编码方式-->
<title>helloworld!</title>
</head>
<body>
helloworld!
</body>
</html>
|
二、标签
(一)基本
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <html> </html> HTML页面根元素
<head> </head> 包含文档的元数据(meta)
<title> </title> 文档标题,存书签时也显示此内容
<body> </body> 包含了页面的可见内容
<h1> </h1> 大标题,往下每一级标题依次h2,h3的类推,最小标题是h6
<p> </p> 段落
<a href= "" > </a> 链接,中间内容为显示内容,例:<a href= "http://www.baidu.com" >百度</a>;如果target= "_blank" ,链接会在新的窗口中打开
<img src= "address" width= "3" height= "5" /> 图像,alt属性可在浏览器无法载入图像时显示文本
<iframe></iframe> 框架,使用src属性指向不同的URL,达到一个窗口显示多个页面的目的;
<br> 换行符,属于一个空元素,即没有内容的元素,空元素是在开始标签中关闭的<br/>
<hr> 分割线
<div> </div> 区块,可用于组合其他元素的容器;可使用它进行布局;
<span> </span> 用来组合文档中的行内元素;
<!doctype html> 声明html版本,不区分大小写
|
(二)文本格式标签
1 2 3 4 5 6 7 8 | <strong> </strong> 加粗显示之间的文字,也可用<b></b>
<em> </em> 斜体,也可用<i></i>
<big> </big> 放大
<small> </small> 缩小
<sub> </sub> 下标文字
<sup> </sup> 上标文字
<ins> </ins> 下划线
<del> </del> 删除线
|
(三)引文、引用及标签定义
1 2 3 4 5 6 7 | <abbr> </abbr> 缩写,被缩写的内容用title属性来体现
<address> </address> 定义地址,通常被包含在<footer>元素的其他信息中
<bdo> </bdo> 定义文字方向,默认值为从左到右,可用dir= "rtl" 来改为从右到左显示
<blockquote> </blockquote> 定义长的引用,可用cite= "URL" 来规定引用的来源
<q> </q> 定义短的引用,属性cite
<cite> </cite> 定义引用、引证
<dfn> </dfn> 定义一个定义项目
|
(四)
1 2 3 4 5 | 1“计算机输出”标签1 <code> </code> 定义计算机代码
2 <kbd> </kbd> 定义键盘码
3 <samp> </samp> 定义计算机代码样本
4 < var > </ var > 定义变量
5 <pre> </pre> 定义预格式文本
|
(五)head元素内包可含元素
1 2 3 4 5 6 | <title> </title>
<base> 定义了页面的默认链接地址,通过href属性来实现
<link> 定义了文档和外部资源的关系,通常可用rel,type,href等属性
<meta> 定义了文档中的元数据,可有name,content,charset等属性
<script></script> 用于加载脚本文件
<style></style> 定义了HTML文档的样式文件
|
(六)图片标签
1 2 3 | 1 <img>
2 <area> 定义带有可点击区域的图像,可有shape,coords等属性,来画各种图形
3 <map></map> 带有可点击区域图像映射,必须有name属性,中间可包含area元素;
|
(七)表格标签
1 2 3 4 5 6 7 8 9 10 | <table></table> 定义表格,表格的所有内容都应放在里边;属性border=“1”定义了边框大小
<caption></caption> 表格标题
<tr></tr> 表格每一行的内容;
<td></td> 一个单元格的内容;
<thead></thead> 表格第一行;
<th></th> 表头内容,即第一行每一格内容;
<tbody></tbody> 表格主体;
<tfoot></tfoot> 表格最后一行;
<colgroup></colgroup> 表格列的组;
<col></col> 表格列的属性;
|
相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!
相关阅读:
用React完成一个图片轮播组件
用<h1>和段落<p> 写一个三毛语录
以上就是HTML入门必知的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
Html中的空格符号是什么
Html表格的基本属性
Html怎么实现内容超出自动隐藏
Html的<figcaption>标签
Html <!--...-->标签怎么用
Html button标签是什么意思?Html button标签的使用细节
Html怎么禁止复制粘贴
10 种快速优化 web 性能的手段(分享)
Html表格的标签是什么
javascript中对Html中元素属性的读取
更多相关阅读请进入《Html》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » HTML入门必知