html基本知识点
本文所使用的编辑器 >>> HBuilder X
学习方式：从上向下逐行阅读
html是hyper text mark-up language首字母的缩写
注释方法：ctrl+shift+/
···HTML5文档···
! + tab #智能显示
<!DOCTYPE html> #文档声明，一定要写
<html lang="zh-CN"> #定义网页文字为中文
<head>
<meta charset="utf-8" /> #设置网页编码
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href=""/> #可以做外部链接
<title>这里可以设置网页标题</title>
</head>
<body>
网页主题内容写在这里
</body>
</html>
···
···HTML-1文档···
html:xt + tab #智能显示
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title></title>
</head>
<body>
</body>
</html>
···
<!--标签学习-->
<h1>这是标题标签,#一共有六级标题</h1>
<p>这里是段落标签</p>
#字符实体，空格
> #字符实体，>
< #字符实体，<
<br /> #换行标签 ,规范写法
<div>这里是块标签, #div可无限制嵌套</div>
<span>这里是一行里的一小块内容, #与样式配合使用</span>
<!--行内元素-->
<em>这里是强调词, #行内元素，语气中的强调词</em>
<i>这里是专业词汇</i>
<b>文档中的关键字或者产品名</b>
<strong>非常重要的内容</strong>
<!--html图像标签-->
<img src="定义图片的引用地址" alt="定义图片加载失败时显示的文字" /> # alt属性很重要
<!--链接-->
<a href="html_2.html">链接另一个网页</a>
<a href="http://www.baidu.com"><img src="./images/touxiang.png" alt="百度链接" ></a> #图片链接
<a href="html_2.html" title="悬停显示">链接另一个网页</a> #悬停显示
<a href="html_2.html" target="_blank" >链接另一个网页,另外再开一个页面</a>
<a href="#">缺省链接</a> #默认链接到页面顶部
<!--列表-->
有序列表
ol>li*3 +tab ----->快捷键
<ol>
<li>html</li>
<li>css</li>
<li>js</li>
</ol>
无序列表
ul>li*2 +tab ------快捷键
ul>(li>a{新闻标题})*3 -----加超链接的快捷键
<ul>
<li>今天</li>
<li>明天</li>
<li>后天</li>
</ul>
定义列表
dl>(dt+dd)*3 -----快捷键
<dl> #表示列表的整体
<dt>html</dt> #定义术语的题目
<dd>负责页面的结构</dd> #术语的解释
<dt>css</dt>
<dd>负责页面的表现</dd>
<dt>javascript</dt>
<dd>负责页面的行为</dd>
</dl>
html表格
<table>声明一个表格
<table>属性
border="#定义表格的边框,设置值是数值"
cellspacing="#表格中内容与表格的距离"
cellpadding="#表格与表格之间的距离"
align="#设置整体表格相对于浏览器窗口的水平对齐方式，设置值有：left | center | right"
width="#设置表格宽度"
height="#设置表格高度"
单元格里面的属性
<th>表示表头单元格 #单元格内容默认加粗，位置居中
<td>表示普通单元格
table>(tr>td*5)*6 ----六行五列快捷键
align="#设置表格中文字相对于表格的水平对齐方式，设置值有：left | center | right"
valign="#设置单元格中内容的垂直对齐方式 top | middle | bottom"
rowspan="#设置单元格垂直合并，设置值是数值"
colspan="#设置单元格水平合并，设置值是数值"
bgcolor="" #设置背景色
<body topmargin="0"> #设置整体表格顶上部位置
<hr /> #画一条线，现在已经不用了
表单
<form action="表单提交的地址" method="表单提交方式，提交敏感信息"> 标签 定义整体的表单区域 <form>
<label>定义文本</label>
<label for="username">用户名:</label> #for属性,激活表格,增强用户
<input type="text" name="username" id="username" />
<input type="text" name="" /> #输入的内容格式,重要：name中值一定要写，与数据库相关
type="file" #文件
type="radio" name="gender" #单选
type="password" #多选
type="text" #单行文本
type="submit" name="" id="" value="提交" #提交
type="image" src="images/html5.png" #图片用作提交,不建议使用
type="reset" name="" id="" value="重置" #重置
<textarea rows=""3 cols="3">输入一段内容</textarea>
<!--下拉列表-->
<select name="site">
<option value ="shanghai">上海</option>
<option value ="">北京</option>
</select>
