html基础（一）_html元素是指从()标签到()标签的所有代码,包括()、()、()。-CSDN博客

本文链接：https://blog.csdn.net/j870752531/article/details/47323535

一、HTML简介

HTML是用来描述网页的一种语言，是指超文本标记语言。

二、html5的新特性
1、用于绘画的canvas标签
2、用于媒介回放的video和audio元素
3、对本地离线储存的更好支持
4、新的特殊内容元素,如：article、footer、header、nav、section

新的表单控件:calendar、date、time、email、url、search

三、html5的兴起

1、html5时代的到来

2、跨平台运行

3、硬件要求低
4、Flash之外的选择

四、开发工具：sublime text3、DW、eclipse等等

自己使用的是sublime text3,可以到官网下载（http://www.sublimetext.com/3），慕课网有相关的视频讲解（http://www.imooc.com/learn/40）

五、html基础讲解
1、声明：<!DOTYPE>
html有多个不同的版本，只有明白页面中使用的确切的html版本，浏览器才能完全正确的显示出html页面。这就是<!DOCTYPE>的用处。
HTML5:
<!DOCTYPE html>
2、html的基础标签
head、body
其基本格式为：

<!DOCTYPE html>
<head>
<title>......</title>
</head>
<body>
......
</body>

3、标题标签
<h1></h1>....<h6></h6>字体的大小逐渐减小
4、段落标签
<p></p>
5、超链接标签
<a href=#>...</a>
6、图片标签

六、HTML元素
1、元素是指从开始标签到结束标签的所有代码

开始标签元素内容结束标签
<p> this is my web page </p>

2、html元素语法：
元素的内容是开始标签与结束标签之间的内容
空元素在开始标签中进行关闭
3、嵌套的html元素

大多数的html元素都是可以嵌套的

七、html属性
1、标签可以拥有属性为元素提供更多的信息
2、属性以键值对的形式出现
如：href="www.jikexueyuan.com"
3、常用标签属性
<h1>:align对齐方式
<body>:bgcolor背景颜色
<a>:target规定在任处打开连接
4、通用属性
class:规定属性的类名
id:规定元素唯一ID
style:规定元素的样式

title:规定元素的额外信息

八、html的格式化

html有许多基础的字体设置，以下是一个小案例，大家可以运行参考一下。

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<title>格式化</title>
</head>
<body>
<b>欢迎学习HTML</b><br/>
<big>欢迎学习HTML</big><br/>
<em>欢迎学习HTML</em><br/>
<i>欢迎学习HTML</i><br/>
<small>欢迎学习HTML</small><br/>
<strong>欢迎学习HTML</strong><br/>
大家好<sub>欢迎学习HTML</sub><br/>
大家好<sup>欢迎学习HTML</sup><br/>
<ins>欢迎学习HTML</ins><br/>
<del>欢迎学习HTML</del><br/>
</body>
</html>

九、html样式
1、标签：
<style>:定义样式
<link>:资源引用
2、属性
rel="stylesheet":外部样式表
type="text/css":引入文档的类型
margin-left:边距
3、三种样式表插入方法：
外部样式表：
<link rel="stylesheet" type="text/css" href="mystyle.css">
内部样式表：
<style type="text/css">
body{background-color:red}
p{margin-left:20px}
</style>
内联样式表：

十、html链接
1、链接数据：
文本链接
图片链接
2、属性：
href属性：指向另一个文档的链接
name属性：创建文档内的链接
3、img标签属性：
alt：替换文本属性
width:宽

height：高

十一、html表格

自己写了一个有关表格的小案例，包括了一些基本的知识。

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<title>表格</title>
</head>
<body>
<table border="1px" cellpadding="20px" cellspacing="5px" bgcolor="pink">
<caption>样例</caption>
<tbody>
<tr>
<th>data</th>
<th>data</th>
<th>data</th>
<th>data</th>
</tr>
<tr>
<td rowspan="2">data1</td>
<td></td>
<td>data3</td>
<td>data4</td>
</tr>
<tr>
<td>
<ul>
<li>苹果</li>
<li>菠萝</li>
</ul>
</td>
<td colspan="2">data7</td>
</tr>
</tbody>
</table>
</body>
</html>