HTML入门必知


本文摘自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》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...