常用的五大浏览器IE、火狐(Firefox)、谷歌(Chrome)、Safari和Opera等
常见浏览器内核(了解)
(1)移动端的浏览器内核主要说的是系统内置浏览器的内核。
(2)Android手机而言,使用率最高的就是Webkit内核,大部分国产浏览器宣称的自己的内核,基本上也是属于webkit二次开发。
(3)iOS以及WP7平台上,由于系统原因,系统大部分自带浏览器内核,一般是Safari或者IE内核Trident的
3.web标准
-
web标准有三层结构,分别是结构(html)、表现(css)和行为(javascript)
-
结构类似人的身体, 表现类似人的着装, 行为类似人的行为动作
-
理想状态下,他们三层都是独立的, 放到不同的文件里面
4.html简介
- HTML 指的是超文本标记语言 (Hyper Text Markup Language)是用来描述网页的一种语言。
超文本
-
因为它可以加入图片、声音、动画、多媒体等内容(超越文本限制 )
-
不仅如此,它还可以从一个文件跳转到另一个文件,与世界各地主机的文件连接(超级链接文本 )。
-
HTML 不是一种编程语言,而是一种标记语言 (markup language)
-
标记语言是一套标记标签 (markup tag)
5.html骨架格式
<html>
<head>
<title>页面标题</title>
</head>
<body>
页面显示内容
</body>
</html>
6.字符集
<meta charset="UTF-8" />
字符集(Character set)是多个字符的集合。
计算机要准确的处理各种字符集文字,需要进行字符编码,以便计算机能够识别和存储各种文字。
基本语法
-
html文档后缀名 .html 或者 .htm
-
围堵(双)标签:有开始标签和结束标签。如
-
自闭和(单)标签:开始标签和结束标签在一起。如
-
标签可以嵌套:
需要正确嵌套,不能你中有我,我中有你
错误:<a><b></a></b>
正确:<a><b></b></a>
-
在开始标签中可以定义属性。属性是由键值对构成,值需要用引号(单双都可)引起来
-
html的标签不区分大小写,但是建议使用小写。
4.常用标签
1.排版标签
2.文本格式化标签
3.图像标签img (重点)
<img src="图像URL" />
4.链接标签(重点)
注意
- 外部链接 需要添加 http://
- 内部链接 直接链接内部页面名称即可 比如 < a href=“index.html”> 首页
- 如果当时没有确定链接目标时,通常将链接标签的href属性值定义为“#”(即href="#"),表示该链接暂时为一个空链接。
5.表格
<table>
<tr>
<td>单元格内的文字</td>
...
</tr>
...
</table>
合并单元格
-
跨行合并:rowspan=“合并单元格的个数”
-
跨列合并:colspan=“合并单元格的个数”
小结
- 表格的主要目的是用来显示特殊数据的
- 一个完整的表格有表格标签(table),行标签(tr),单元格标签(td)组成,没有列的标签
- 中只能嵌套 类的单元格
- 标签,他就像一个容器,可以容纳所有的元素
6.列表
分类
无序列表 ul (重点)
无序列表的各个列表项之间没有顺序级别之分,是并列的。
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
......
</ul>
注意
1. <ul></ul>中只能嵌套<li></li>,直接在<ul></ul>标签中输入其他标签或者文字的做法是不被允许的。
2. <li>与</li>之间相当于一个容器,可以容纳所有元素。
有序列表即为有排列顺序的列表,其各个列表项按照一定的顺序排列定义
<ol>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
......
</ol>
自定义列表(理解)
定义列表常用于对术语或名词进行解释和描述,定义列表的列表项前没有任何项目符号
<dl>
<dt>名词1</dt>
<dd>名词1解释1</dd>
<dd>名词1解释2</dd>
...
<dt>名词2</dt>
<dd>名词2解释1</dd>
<dd>名词2解释2</dd>
...
</dl>
表单
作用
表单目的是为了收集用户信息。在我们网页中, 我们也需要跟用户进行交互,收集用户资料,此时也需要表单。
常用控件
input 控件(重点)
<input type="属性值" value="你好">
label标签(理解)
label标签主要目的是为了提高用户体验
用于绑定一个表单元素, 当点击label标签的时候, 被绑定的表单元素就会获得输入焦点。
绑定方式
第一种用法就是用label直接包括input表单
<label> 用户名: <input type="radio" name="usename" value="请输入用户名"> </label>
第二种用法 for 属性规定 label 与哪个表单元素绑定
<label for="sex">男</label>
<input type="radio" name="sex" id="sex">
textarea控件(文本域)
<textarea cols="每行中的字符数" rows="显示的行数">
文本内容
</textarea>
select下拉列表
<select>
<option selected =" selected ">选项1</option>
<option>选项2</option>
<option>选项3</option>
...
</select>
form表单域
在HTML中,form标签被用于定义表单域,以实现用户信息的收集和传递,form中的所有内容都会被提交给服务器。
<form action="url地址" method="提交方式" name="表单名称">
各种表单控件
</form>
拓展
1.注释标签
<!-- 注释语句 -->
快捷键是: ctrl + / 或者 ctrl +shift + /
2.路径(重点)
1.绝对路径
绝对路径以Web站点根目录为参考基础的目录路径。
2.相对路径
以引用文件之网页所在位置为参考基础,而建立出的目录路径。
当前页面路径
./ 或者 /
上一级页面路径
…/
上一级的上一级页面路径
…/…/
3.HTML5语义化标签
html5中为了提高程序的可读性,提供了一些标签。
常用标签
定义标题栏——header
通常用来放置整个页面或页面内的一个内容区块标题
定义导航块——nav
是一个可以用作页面导航的链接组,其中的导航元素链接到其他页面或当前页面的其他部分。
定义内容块——section
用于对网站或应用程序中页面的内容进行分段
通常由标题和内容组成
定义文章块——article
1)用来表示文档、页面中独立的、完整的、可以独自被外部引用的的内容。
2)通常包含头部(header)、底部(footer)元素
3)是一种特殊种类的section元素,它比section元素更强调独立性
定义侧边栏——aside
用来表示当前页面或文章的附属信息部分
定义脚注栏——footer
作为内容块的脚注
例如:添加注释,添加版权信息,相关阅读链接等