HTML
HTML-超文本标记语言 标识性语言 非编程语言
超文本 一种组织信息方式 超级链接将多种媒介关联起来
标记 用<>包裹一定内容
HTML功能
- 超链接检索在线信息
- 展示在线文档 包含多种内容
- 为获取远程服务而设计表单,用于检索信息、订购产品等
- 在文档中包含电子表格、视频剪辑、声音剪辑以及其他应用
HTML历史
HTML 1991
HTML+ 1993
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 1.0 2000
HTML5 2012
静态网页 动态网页
动态网页-网页随数据(时间、环境、数据库)改变
静态网页-表现效果固定
浏览器
IE、火狐、谷歌、欧朋、苹果
内核-引擎装置 渲染引擎 JS引擎
内核:Trident(IE) Gecko(FX) WebKit(safari) Blink(chrom/opera)
国内大多数浏览器采用双核驱动 Trident&webkit Trident&Blink
移动端 iPhone/ipad-Wedkit android4.4-Wedkit 4.4以上-Blink
<!DOCTYPE html> html5解析 ! 声明的意思
<html>
<!-- 头部,网页相关设置>
<head>
<meta charset="utf-8"> meta:元 主要完成对应设置
<meta name="keywords" content=""><!--关键字>
<meta name="description" content="">
<title>标题<title>
<!--设置图标>
<link rel="shortcut icon " herf="源" type="image/格式">
<style>
样式
</style>
<link rel="stylesheet" herf="路径"> 引入外部样式文件
</head>
<!--主体部分>
<body>
<p>段落标签</p>
</body>
<!--脚本代码>
<script>
脚本
</script>
</html>
标准
HTML
<meta http-equiv="content-type" content="text/html:charset="utf-8" />
<meta charset="utf-8" />
CSS
<style type="text/css"> </style>
JS
<script language="JavaScript" type="text/css"> </script>
不要再注释里加“——”
所有标签和属性名都必须要小写
所有属性值都必须用双引号括起来
如果文档使用特殊字符 用实意字符转换
要给所有属性一个值 如果没赋值 那值为属性名本身
标签必须要闭合
标签要合理嵌套 不能出现嵌套交叉
图片要添加alt属性值
form表单中要添加lable 以增加用户友好度
单标签和双标签
单标签:由一个标签组成。
双标签:由“开始标签”和“结束标签”两部分构成。
HTML实体转义符
实体字符 | 编译后字符 |
---|---|
$lt; | < |
$gt; | > |
$amp; | & |
$nbsp; | 空格 |
$copy; | © |
$times; | × |
$divide; | ÷ |
块级元素
(display block)
单独一行
高度、宽度可控
默认宽度为铺满
可以包含块级元素和行级元素
div p hx ul ol pre table address
行级元素
(display line)
不会独占一行,与相邻行级元素占同一行,占满自动换行
宽度、高度不可控
其内只能包含行级元素
span a b strong i em sup sub
img属于行级块标签
W3C
万维网联盟 World Wide Web
统一标准的解析规则
结构(HTML),表现(CSS),行为(JavaScript)
标签嵌套规则
-
块级标签可以包含内联元素和某些块级元素,但内联元素却不能包含块元素,只能包含其他的内联元素
-
块级元素不能放在
里面
-
几个特殊块级元素只能包含内嵌元素,不能在包含块级元素
hx p dt -
块级元素和块级元素并列、内嵌元素和内嵌元素并列
HTML语义化标签
语义化——合理HTML标记以及其特有的属性去格式化文档内容。(明白标签使用)
项目开发
项目开发时 项目文件或目录名不能出现汉字空格 用字母或下划线开头