HTML5部分
导读
- 浏览器内核(渲染引擎):负责读取网页内容,整理讯息,计算网页的显示方式并显示页面。
- web标准包括结构(html)、表现(css样式)和行为(交互,如javascript)三个方面
-
就是告诉浏览器使用哪种html版本来显示网页,这里是html5版本<!DOCTYPE html>
-
定义网页显示的语言lang
为英文,en
为中文,如果是zh-CN
,则谷歌会提示“是否翻译为中文”?en
-
属性规定html文档用哪种字符编码charset
1. 路径的概念:
实际工作中,文件不能随便放,需要一个文件夹来管理
相对路径:就是相对于HTML页面的位置
同级路径: 下一级路径:/ 上一级路径:…/
绝对路径:从磁盘开始的路径:C:\USERS\Desktop**,也可以复制网页上的图片链接直接导入网页上的图片
2. 特殊符号代码
在HTML中一些符号需要用相对应字符才能表示,具体如下:
特殊字符 | 描述 | 字符的代码 |
---|---|---|
空格符 |   | |
< | 小于号 | < |
> | 大于号 | > |
& | 和号 | & |
¥ | 人民币 | ¥ |
© | 版权 | © |
® | 注册商标 | ® |
° | 摄氏度 | ° |
± | 正负号 | ± |
× | 乘号 | × |
÷ | 除号 | ÷ |
² | 平方2 | ² |
³ | 立方3 | ³ |
3. 标签及属性介绍
- 标题标签
,标题文字加粗加大,且独占一行<h1></h1>
- 段落标签
<p>paragraph</p>
- 换行标签
,这是一个单标签<br>
- 加粗标签
或者<strong></strong>
,推荐用前者<b></b>
- 倾斜标签
或者<em></em>
,推荐前者<i></i>
- 删除线标签
或者<del></del>
,推荐用前者<s></s>
- 下划线标签
或者<ins></ins>
,推荐前者<u></u>
-
和<div>
标签是没有语义的,相当于一个盒子来装内容,一个<span>
标签独占一行;而一行可以显示多个<div>
<span>
-
标签用于定义html页面中的图像<img>
<img src=“图”/>
-
是src
标签的必须属性,用于指定图像文件的路径和文件名img
-
是alt
中的一个属性,表示图片显示不出来时替换为文字img
-
是title
的一个属性,鼠标放到图片上会出现提示文字img
-
都是width,height,border
的属性,以空格隔开,来设置图片的宽度、高度和边框宽度,宽和高只需设置一个即可等比缩放img
- 属性均采取键值对的格式,即
,key=“value”
属性=“属性值”
- 外部链接标签
,其中<a href=”跳转目标” target=”目标窗口弹出方式”>文本或图像 </a>
必须以href
开头。http://
是当前窗口打开页面,_self
是新窗口打开_blank
- 内部链接:网页内部页面之间的相互链接
- 空链接
<a href=”#”> </a>
- 下载链接,链接地址需为.exe或.zip文件
- 锚点链接:直接跳转到当前页面中的某个位置:
可以跳转到相应id的位置<a href=”#id”>点我</a>;
- 注释标签 ,快捷键crtl+/
- 表格标签:
爷爷,<table>
爸爸,<tr>
孙子<td>
-
<th>加粗</th>
-
的属性有:table
,规定对其方式;align
,规定是否拥有边框;border
,规定表格宽度;width
规定单元格内文字与边框之间的距离;cellpadding
规定单元格之间的距离。cellspacing
-
标签和thead
标签用来定义表格的头部和尾部,是tbody
的子标签,table
里必须包含thead
标签tr
- 跨行合并
,最上侧单元格为目标单元格rowspan
- 跨列合并
,最左侧单元格为目标单元格,删除多余格colspan
- 无序列表
里面的内容用ul
定义,li
中只能放ul
标签,但li
标签里面可以放任何标签。有序列表li
,(很少用)ol
- 自定义列表标签
,里面的大哥是dl
,小弟是dt
,dd
和dt
是并列关系,并不是包含关系,小弟追随大哥显示,dd
只能放dl
和dt
。一个dd
包括一个大dl
和多个小dt
。dd
- 表单由表单域
(总),表单空间和提示信息组成form
-
的常用属性有form
(值为action
,用于指定接受数据的服务器url
地址),url
(值为method
或get
),post
name
- 表单控件:
输入表单元素,必要属性为input
,其他常用属性type(button,checkbox,file,hidden,image,password,radio,reset,submit,text)
(后台可以通过这个name
属性找到这个表单,单选按钮和复选框必须起相同的名字),name
(表单内默认显示的字以及定义返回给后台人员的内容),value
(默认勾选内容),checked
表单中的提交标签maxlength
把submit
表单中的所有表单元素里面的值提交给后台服务器,后台可以通过表单中的form
来区分表单内容name
-
标签用于绑定一个表单元素,当点击label
标签内的文字时,浏览器会自动将焦点/光标转到或选择对应的表单元素上,语法:label
<label for=”sex”>男</label>
<input type=”radio” name=”name” id=”sex”/>
-
与label
是并列标签,组合使用input
- 下拉选择标签
,字标签select
,option
中可以定义option
表示默认选中selected="selected"
- 文本域标签
,属性有textarea
显示多少行,rows
一行显示多少字,实际开发不会用,将通过css来设置。注意:cols
标签要写到一行上,不然文本域默认会带有大片空白区域textarea