今天想整理下关于HTML的先关知识。
现在的业界的标准，网页技术严格的三层分离：html就是负责描述页面的语义；css负责描述页面的样式；js负责描述页面的动态效果的。
所以，html不能让文字居中，不能更改文字字号、字体、颜色。因为这些都是属于样式范畴，都是css干的事儿；html不能让盒子运动起来，因为这些属性行为范畴，都是js干的事儿。
html只能干一件事儿，就是通过标签对儿，给文本增加语义。这是html唯一能做的。
编写代码工具
1.sublime
2.webstorm
3.vscode
sublime中的常用快捷键：
ctrl+滚轮 放大缩小文字
ctrl+shift+d 复制当前行
ctrl+shift+k 删除当前行
ctrl+shift+↑ 上移当前行
ctrl+shift+↓ 下移当前行
HTML 简介
超文本标记语言
HTML负责页面的结构. 它是通过HTML标签的形式来定义出页面中的各个部分
HTML页面基本结构
<!doctype html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <body> </body> </html>
HTML 标签
标签又称之为元素
普通标签
语法<标签名></标签名>
自结束标签
语法:<标签名/>
属性
可以在标签或自结束标签中为标签(元素)添加属性
语法:
<标签名 属性名=“属性值”></标签名><标签名 属性名=“属性值” />
HTML常用标签
<!doctype html>文档声明. 表示当前页面是以HTML5规范编写的
<html>网页的根标签,有且只有一个.网页的所有内容都在根标签中
<head>网页的头部标签. 可以帮助浏览器来解析页面或帮助搜索引擎检索网页
<title>网页的标题标签. 内容会默认显示在网页的标题栏中
搜索引擎检索网页时会主要检索title中的内容.来判断网页的主要内容.会影响到网页在搜索引擎的排名
<meat/><link href="img/icon_mouse_32.ico" rel="shortcut icon" type="image/x-icon"/><meta http-equiv="refresh" content="3;url=http://www.baidu.com" /><meta name="description" content="专注于搜集美女图片的网站" /><meta name="keyword" content="前端,html5,java”/><meta charset="utf-8" />定义当前页面的字符集
可以定义网页中的关键字
可以设置网页的描述信息
可以用来做重定向请求
可用来制作网站的小图标
<body>网页的主题. 所有可见内容都应该写在body标签中
<h1>~<h6>内容标题标签
从h1到h6重要性依次递减
一般一个页面中只有一个h1标签
一般只使用h1-h3
<p>网页中的段落标签
<br/>换行
<hr/>水平分割线
<ul><li>无序列表
<ol><li>有序列表
<dl><dt><dd>定义列表
<img/>图标标签
属性:
src: 指向外部图片的路径
alt: 图标描述信息
<a>_self: 默认值.当前窗口的卡爱
_blank: 在新的窗口的打开
通过超链接可以使从一个页面跳转到另一个页面
属性:
href: 指定要打开的页面地址或路径
target:[可选] 要打开页面的位置
<!-- -->html注释的内容
用来对代码进行描述或解释说明
实体 (转义字符)
可以使用实体来表示一些特殊符号
语法:
&实体名字; ©
&#x四位code编码;☭
常用实体:
空格
小于号<
<大于号>
>版权符号
©
HTML 表格
使用
<table>标签创建表格在
table标签中使用<tr>来代表表格中的一行在
<tr>标签中使用<td>代表每一行中的单元格<thead>表示表格的头部.永远显示在表格头部
可以将头部信息的
<tr>放到<th>中填写头部信息<tbody>表示表格的主体. 可以将主题的
<tr>放到`````````中<tfoot>表示表格的底部. 可以将底部的
<tr>放到<tfoot>中注意: 默认情况下的如果创建一个表格没有指定
<tbody>时浏览器会自动添加一个.并将所有<tr>都放到<tbody>里.选择器使用后代选择器
HTML 表单
使用
<form>标签来创建表单表单标签必须有一个action属性
action需要一个服务器地址.当提交表单时,会提交到该地址
表单常用种类
文本框
使用input标签创建
type="text"提交到服务器元素必须指定name属性
密码框
使用input标签创建
type="password"提交按钮
使用input标签创建
type="submit"提交按钮中可通过设置value的值指定按钮中的文字
单选项
使用input标签创建
type="radio"checked="checked"单选框默认选中状态name属性用来对单选项分组
value属性会提交到服务器
多选项
使用input标签创建
type="checkbox"checked="checked"多选框默认选中状态name属性用来对单选项分组
value属性会提交到服务器
下拉列表
使用
<select>标签创建下拉列表<select>标签需要name属性使用
<option>标签来向下拉列表中添加选项<option>标签需要value属性可以为某个
<option>添加selected=“selected”设置默认选中状态可以为
<select>添加一个属性multiple="multiple"可以设置多选重置按钮
使用input标签创建
type="reset"按钮
type="button"创建一个单纯的按钮也可以使用
<button>标签来创建<button>更加灵活