前端基础之html
html是什么
-
超文本标记语言(Hypertext Markup Language,HTML)通过标签语言来标记要显示的网页中的各个部分。一套规则,浏览器认识的规则
-
浏览器按顺序渲染网页文件,然后根据标记符解释和显示内容。但需要注意的是,对于不同的浏览器,对同一标签可能会有不完全相同的解释(兼容性)
-
静态网页文件扩展名:.html 或 .htm
-
HTML 不是一种编程语言,而是一种标记语言 (markup language)
HTML 使用标记标签来描述网页
html结构
网页标题 网页正文内容
- 告诉浏览器使用什么样的html或者xhtml来解析html文档
- 是文档的开始标记和结束标记。此元素告诉浏览器其自身是一个 HTML 文档,在它们之间是文档的头部和主体。
- 元素出现在文档的开头部分。与之间的内容不会在浏览器的文档窗口显示,但是其间的元素有特殊重要的意义。
定义网页标题,在浏览器标题栏显示。 - 之间的文本是可见的网页主体内容
html标签格式
html常用标签
1 html标题
to
"en"> "UTF-8"> "x-ua-compatible" content="IE=edge"> "viewport" content="width=device-width, initial-scale=1">html标题Title AAA
AAA
AAA
AAA
AAA
AAA
结果如下:
2 html水平线
"en"> "UTF-8"> "x-ua-compatible" content="IE=edge"> "viewport" content="width=device-width, initial-scale=1">html水平线Title AAA
结果如下:
3 html注释
注释并不会显示在网页上
"en"> "UTF-8"> "x-ua-compatible" content="IE=edge"> "viewport" content="width=device-width, initial-scale=1">html注释Title BBB
结果如下:
4 html段落 以及段落换行
: 段落标签. 包裹的内容被换行.并且也上下内容之间有一行空白.
当显示页面时,浏览器会移除源代码中多余的空格和空行。所有连续的空格或空行都会被算作一个空格。需要注意的是,HTML 代码中的所有连续的空行(换行)也被显示为一个空格。
"en"> "UTF-8"> "x-ua-compatible" content="IE=edge"> "viewport" content="width=device-width, initial-scale=1">段落标签Title hello world
hello world
显示结果如下:
"en"> "UTF-8">段落换行用Title hello world
hello
world
显示结果:
5 html文本格式化
href指定超链接地址
target指定打开方式
_blank 新页面打开
"en"> "UTF-8">超链接Title hello world
"http://www.baidu.com">百度
显示结果如下,点击 百度 跳转到 百度网页。
7 html的图像
使用格式:
alt 定义当图片无法加载时,显示什么信息
width 定义宽度,单位可以为像素 也可以为百分比
height 定义高度
title: 鼠标悬浮时的提示信息.
"en"> "UTF-8"> "x-ua-compatible" content="IE=edge"> "viewport" content="width=device-width, initial-scale=1">imgTitle hello world
"http://www.baidu.com">"1.jpg",alt="logo",title="windows7 logo"/>
src:
8 html的表格 表格由 border 定义边框 在 colspan 定义表头单元格可以横跨的列数。 rowspan 定义表头单元格横跨的行数 heardes 定义与表头单元格相关联的一个或者多个单元格。(html5新增) colspan 定义单元格可以横跨的列数。 rowspan 定义单元格横跨的行数 heardes 定义与单元格相关联的一个或者多个单元格。(html5新增) border: 表格边框. cellpadding: 内边距 cellspacing: 外边距. width: 像素 百分比.(最好通过css来设置长宽) 结果如下: 另外,若某个单元格为空,浏览器可能无法显示出这个单元格的边框。为了防止这种情况,可以在该单元格加一个空格占位符 9 html列表 列表分为 无序列表 有序列表 列表项内部可以使用段落、换行符、图片、链接以及其他列表等等 结果如下: 10 html表单 表单是一个包含表单元素的区域。 表单元素是允许用户在表单中(比如:文本域、下拉列表、单选框、复选框等等)输入信息的元素
来定义,每行
有许多单元格 。表头可以使用
标签属性:
中可以嵌入
等标签
定义行
定义表头
定义单元格
"en">
"UTF-8">
"x-ua-compatible" content="IE=edge">
"viewport" content="width=device-width, initial-scale=1">
"1px">
table表格
"2" >name
"2">list
"name">first name
"name">last name
 。
"en">
"UTF-8">
"x-ua-compatible" content="IE=edge">
"viewport" content="width=device-width, initial-scale=1">
无序和有序列表