HTML入门

阅读量：4489 次

发布时间：2019-06-08

本文共 6767 字，大约阅读时间需要 22 分钟。

一、简介

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 　　　　helloworld! 6 　　 7 　　 8  　 　　helloworld! 9 　　10

二、标签

（一）基本

1 HTML页面根元素 2 包含文档的元数据(meta) 3 　文档标题，存书签时也显示此内容 4 包含了页面的可见内容 5

大标题，往下每一级标题依次h2,h3的类推，最小标题是h6 6

段落 7 链接，中间内容为显示内容，例：百度；如果target="_blank"，链接会在新的窗口中打开 8

图像，alt属性可在浏览器无法载入图像时显示文本9 框架，使用src属性指向不同的URL，达到一个窗口显示多个页面的目的；10

换行符，属于一个空元素，即没有内容的元素，空元素是在开始标签中关闭的

分割线12

区块，可用于组合其他元素的容器；可使用它进行布局；13 用来组合文档中的行内元素；14 声明html版本，不区分大小写

（二）文本格式标签

1    加粗显示之间的文字，也可用2         　　斜体，也可用3          放大4      缩小5         下标文字6         上标文字7          下划线8          删除线

（三）引文、引用及标签定义

1          　　　　缩写，被缩写的内容用title属性来体现2  
　　　　　定义地址，通常被包含在
     
      元素的其他信息中3 
              　　　　   定义文字方向，默认值为从左到右，可用dir="rtl"来改为从右到左显示4 
       
      
   定义长的引用，可用cite="URL"来规定引用的来源5 
                  　　　　　　定义短的引用，属性cite6 
               　　　　定义引用、引证7 
              　　　　　　定义一个定义项目

（四）“计算机输出”标签

1        定义计算机代码2          定义键盘码3        定义计算机代码样本4          定义变量5  
        定义预格式文本

（五）head元素内包可含元素

1  　　2                 定义了页面的默认链接地址，通过href属性来实现3 
                     定义了文档和外部资源的关系，通常可用rel,type,href等属性4 
                     定义了文档中的元数据，可有name,content,charset等属性5      用于加载脚本文件6        定义了HTML文档的样式文件

（六）图片标签

1 2                  定义带有可点击区域的图像，可有shape,coords等属性，来画各种图形3             带有可点击区域图像映射，必须有name属性，中间可包含area元素；

（七）表格标签

1 
     
        定义表格，表格的所有内容都应放在里边；属性border=“1”定义了边框大小 2     表格标题 3               表格每一行的内容； 4               一个单元格的内容； 5         表格第一行； 6            　　表头内容，即第一行每一格内容； 7         表格主体； 8         表格最后一行； 9   表格列的组；10             表格列的属性；

（八）列表标签

1 
      
     
            有序列表，可通过type属性来改变编号，默认为数字，还有A(大写字母),a(小写字母)，I(罗马数字),i(小写罗马数字)2 
      
     
            无序列表,可通过style属性来改变前边的小标识，值有"list-style-type:square"，circle,disc等；3  
            列表项；4 
      
     
            定义列表；5 
      
     
            自定义列表项目；6 
      
     
            自定列表项的描述；

（九）表单标签

1 
      
     
       　　　　定义一个包含表单元素的区域，表单本身并不可见； 2      输入域，当用户需要在表单中输入内容时使用；普通为text，如为密码字段可用password，将会以掩码显示；radio单选框，checkbox复选框，submit提交按钮， 3  　　　 一个多行输入的文本域，属性有rows,cols等； 4      　　　 　元素标签，属性for="element_id",form="form_id",两个属性用于关联表单元素或表单； 5 
     
　　　　使表单被外框包围起来； 6     　　　　定义了fieldset元素的标题； 7    　　　　 定义了下拉框列表，其他选项用   　　　　 定义下拉框的选项，常用的属性有value 9 　　　　对option进行分组，不是实际选项,可使用label属性来显示组名；10    　　　　 按钮，属性有type(button,reset,submit),name,value，onclick(点击显示内容)

三、属性

1、属性是HTML元素提供的附加信息，一般写在开始标签内，以name="value"的形式出现；

2、属性值应该被包括在引号内,单双引号都可以，如果属性值本身含有一种引号，就必须使用另一种引号；

3、常用属性

class 定义一个或多个类名

id 定义元素的唯一的id

style 规定元素的行内样式

title 描述了元素的额外信息（作为工具条使用）

href 链接

四、CSS(Cascading Style Sheets)

1、CSS是用于渲染HTML元素标签的样式，从HTML4开始使用的；

2、通过三种方式添加到HTML中

内联样式：在HTML元素中使用style属性；

内部样式表：在<head>区域使用<style>元素来包含CSS；

外部引用：使用外部CSS文件；

3、具有十分强大的功能，可对字体、颜色、大小、背景、排版等功能进行设定，具体可参考CSS的使用；

五、字符实体

1、HTML中预留字符必须被替换为字符实体，一些在键盘上找不到的字符也可以使用字符实体来替换，如声调字符等；

2、实体名称对区分大小写；

3、具体可参考HTML实体参考手册，以下是常用实体参考；

附：HTML常用标签使用示例

2 3

5 HTML常用标签示例

7 8

HTML常用标签示例

二号标题

段落

13 超链接

18 19 20

一、文本格式标签

21 文本加粗

22 文本斜体

23 文本放大

24 文本缩小

25 下划线

26 ~~删除线~~

27 _下标 28 ^上标

29 30 31

二、引文、引用及标签

32 缩写

这是地址的书写样式

34 这行文字的方向是反的

36 很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长的引用 37

38 短引用

39 这是一个引证

40 定义项目 41 42 43

三、“计算机输出”标签

44 一段电脑代码

45 计算机样本

46 键盘输入

47 变量

 49         预格式文本 50             可以直接回车换行 51

52 53 54

四、图片标签

55 img图见封面

56 下图有惊喜

59 60 61 62 63

64 65 66 67

五、表格标签

表格标题
th1	th2	th3
td1	td2
td3	td4

82 83 84

六、列表标签

有序列表

列表项1

列表项2

90 91

无序列表

列表项1

列表项2

96 97

自定义列表

自定义列表项目1: 自定列表项的描述1
自定义列表项目2: 自定列表项的描述2

104 105

七、表单标签

106

111

118

122

125

141 142 143

HTML常用标签使用示例

转载于:https://www.cnblogs.com/aland-1415/p/7414457.html

你可能感兴趣的文章

Android实战技巧：如何在ScrollView中嵌套ListView

查看>>

Uva 1626 - Brakets Sequence（DP）

查看>>

makefile

查看>>

HTTP 错误 500.19 - Internal Server Error

从零开始编写自己的C#框架（26）——小结

centos使用--supervisor使用

查看>>

HDU5449 Robot Dog

查看>>