--------------------------------------HTML简介---------------------------------------
HTML(HyperText Marked Language):超文本标记语言,是一种标识性的语言,包括一系列标记标签
标签:可以称为元素,不同的标签有不同的功能解释,用来表示不同的功能。
W3C:HTML由 W3C制定的,W3C(World Wide Web Consortium)是一个非盈利性组织。在中国的北京航空航天大学设有分部
页面整体分为两部分:
一部分是head部分,主要是页面的整体信息和配置,内容不会出现在浏览器内部。
一部分是body部分,这部分内容则会在浏览器中展示出来
--------------------------------------标签简介---------------------------------------
标签:
由一对尖括号包裹单词构成,如:<body>
标签不区分大小写,推荐小写
嵌套:
标签可以嵌套,但不能交叉嵌套
标签使用规则:
开始标签-标签体-结束标签,如:<a > 百度 </a>
自闭合标签直接使用,如:换行,水平线,输入框,图片<br>,<hr>,<input><img>
标签属性:
通常为键值对形式出现,eg:color=“red”
属性只能出现在开始标签和自闭合标签内
属性名字全部小写,属性值必须用单引或者双引包裹
如属性名和属性值完全一样,直接写属性名即可,eg:“readonly”(input标签属性)
--------------------------------------常用标签---------------------------------------
块级标签:<h1>/<p>/<ol>/<ul>/<div>/<table>/<form>
标题标签:一般用在文章的标题,有h1~h6
段落标签:用于文章段落
列表标签:列表标签分为:有序列表、无序列表以及定义
div标签:分割一块区域
内联标签:<img/>/<b>/<i>/<a>/<span>/<input/>/<sub>/<sup>/<textarea>
图片标签:用于在网页中插入图片
粗体/斜体标签:用于网页中突出字体
超链接标签:用于链接其他资源,可以用来跳转或者锚点
文字标签:span标签是纯文本,配合CSS则可以展示不同效果
HTML转义:
字符 | 转义字符 |
" | " |
& | & |
< | < |
> | > |
空格 | |
全角空格(宽度刚好一个中文宽度) |   |
©版权 | © |
¥ | ¥ |
®已注册 | ® |
± | ± |
--------------------------------------行内元素inline和块级元素block---------------------------------------
行内元素对文字可以提供更加丰富的操作空间,块级元素更多是用于整体页面的构造
通过样式中的 display, 可以改变元素是块级还是行内的属性
--------------------------------------表格<table>---------------------------------------
表格的作用主要以表格形式来展示数据,主要分为:
表头thead(默认加粗、居中)、单元格tbody(表身正规要写,实际中常会省略)、表脚tfoot(结尾,一般没写)
--------------------------------------表单<form>---------------------------------------
表单是搜集用户数据信息的各种表单元素的集合区域,用于收取用户数据并向后台发送,前后交互的方式之一
表单常应用于 登录注册,搜索,文件上传等
表单<form>属性:
action:提交时候的地址,默认使用当前页面
method:提交时候的方法有get 和 post 两种方法,默认使用 get
entype:设置编码格式 有三种
默认:application/x-www-form-urlencoded
上传文件:multipart/form-data
不建议使用:text/plain
form内部标签:
input:
type属性值:
txt -- 文本框
password -- 密码框
radio -- 单选框
checkbox -- 复选框
file -- 文件选择
hidden -- 隐藏域
submit -- 提交
reset -- 重置
buttom -- 按钮,需配合js使用
name:表单与后台交互时最重要的一个属性
与id不同,name属性是和服务器通信时使用的名字,而id属性是浏览器端使用的名字,该属性主要方便客户编程而在css和js中使用
value:表单提交项的值 。input的值,单选多选下拉框必须设置value属性,这样后台才能获得你选中的到底是哪个或哪几个选项
其他:placeholder: 提高用户体验度
readonly:只读
disabled:禁用
option下拉选项:下拉框的基本标签,有多少个option 就有多少个下拉选项
size下拉框显示:表示下拉框,显示多少个,默认为一个
name下拉框的名字:表示下拉框向后台提交数据的时候,所传的名字
selected下拉状态:表示选中某个下拉选项
其他标签:fieldset 给表单设置分组
legend 设置分组表单的标题
label 提高用户体验度
select
textarea