、一重点知识
前端语言不区分大小写
配置信息用户是看不见的，是给浏览器和网页用的
前端页面写完一定要保存
语义化是为了搜索引擎更好的检索
标题标签中 h5 和 h6的语义特别弱，浏览器不一定检索到
p 标签重要的是他的语义
span标签没有具体的语义
超链接中加网址要加http，写全
img标签中 ../代表上一层目录 ./代表当前目录
from标签属性 methon 请求方式
get : 删除和查询，针对不同的浏览器有不同的提交规则，而且提交数据可见
post:更新和添加，添加的数据是隐藏的
转义字符后面要加分号
每一个标签都有类属性
id选择器全局唯一
选择器的层叠，谁离标签越近，谁优先级越高
xiaopiu网站 页面设计
图片设置长度，宽度和长度只用设置一个，他会自己等比缩放
p标签默认有段落间隔，会与其他标签有间隔，默认上下都有间距，而div标签没有
布局时不要用带语义的标签布局，一般布局都用标签div
二课堂知识
一、HTML
第1节 HTML简介
- HyperText Markup Language
- 超文本标记语言
- Html通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件，通过在文本文件中添加标记符，可以告诉浏览器如何显示其中的内容（如：文字如何处理，画面如何安排，图片如何显示等）
第2节 网页的基本结构
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
</body>
</html>
<!DOCTYPE html>: 版本的声明,当前是html5版本
html标签: 网页的根标签,所有其它的标签都被html包含
head头部标签: 网页的配置信息
<meta charset="utf-8">:字符集(编码的设置)
<meta name="keywords" content="关键词">
为搜索引擎提供的关键字列表：各关键词间用英文逗号","隔开
<meta name="description" content="描述信息">
Description用来告诉搜索引擎你的网站主要内容
第3节 body标签
主体标签: 所有的显示效果的标签和内容都被body包含
第4节 HTML标签基本结构
<p>开始标签，结束标签</p>双标签
<br/> <img src="123.jpg"/>单标签
第5节 标签的语法
- 标签由英文尖括号<和>括起来，如<html>就是一个标签
- html中的标签一般都是成对出现的，分开始标签和结束标签。结束标签比开
始标签多了一个/ - 标签与标签之间是可以嵌套的，但先后顺序必须保持一致，如：
<div>内嵌套<p>，那么</p>必须放在</div>的前面
- HTML标签不区分大小写
<h1>和<H1>是一样的，但建议小写，因为大部分程序员都以小写为准
第6节 语义化，让你的网页更好的被搜索引擎理解
标签的用途:我们学习网页制作时，常常会听到一个词，"语义化"。那么什么叫做语义化呢，说的通俗点就是：明白每个标签的用途（在什么情况下使用此标签合理）比如，网页上的文章的标题就可以用标题标签，网页上的各个栏目的栏目名称也可以使用标题标签。文章中内容的段落就得放在段落标签中，在文章中有想强调的文本，就可以使用 em 标签表示强调等等。
第7节 常用标签
- 标题 h1~h6
<h1>标题一</h1>
<h2>标题二</h2>
<h3>标题三</h3>
<h4>标题四</h4>
<h5>标题五</h5>
<h6>标题六</h6>
- 段落 p
<p>这是一个段落</p>
- 强调/加强语气 strong 或 em
em:强调->默认是斜体 strong：更强烈的强调 ->粗体
<em>强调</em>
<strong>强烈的强调</strong>
- 换行 br
<br/>
- 分隔线 hr
<hr/>
- 联系地址 address
<address>北京市,沙河区,北科</address>
- 添加一行代码 code
<code>一行代码</code>
- 添加一段代码 pre
<pre>多行代码</pre>
- 给文本增加样式的标签 span
<span> 文本 </span>
- 短引用文本 q
<q>短引用文本</q>
- 长引用 blockquote
<blockquote> 常引用 </blockquote>
- 无序列表 ul + li
<ul>
<li>无序列表1</li>
<li>无序列表2</li>
<li>无序列表3</li>
<li>无序列表4</li>
</ul>
- 有序列表 ol + li
<ol>
<li>有序列表1</li>
<li>有序列表2</li>
<li>有序列表3</li>
<li>有序列表4</li>
</ol>
- 布局标签 div
- 表格标签 table
<table>
<tr>
<td>ID</td>
<td>名字</td>
<td>年龄</td>
</tr>
<tr>
<td>1001</td>
<td>李雷</td>
<td>18</td>
</tr>
</table>
- 链接 a
<a href="#">发送</a>
- 图片 img
- 表单标签 form 输入框 input
- 文本域 textarea
- 下拉列表 select + option
- 提交/重置按钮/lable标签
<form>
性别:
<label for="male">男</label>
<input type="radio" name="gender" id="male"/>
<label for="female">女</label>
<input type="radio" name="gender" id="female"/><br/>
兴趣:
篮球 <input type="checkbox" name="a" />
足球 <input type="checkbox" name="b" />
台球 <input type="checkbox" name="c" />
<br/>
<label for="email">邮箱</label>
<input type="email" name="email" id="email" placeholder="输入邮箱地址"/><br/>
<label for="desc">描述</label>
<textarea value="文本域" name="desc" id="desc"></textarea><br/>
<label for="address">地址</label>
<select id="address">
<option>北京</option>
<option>上海</option>
<option>天津</option>
<option>南京</option>
</select>
<br/>
<input type="submit" value="提交" />
<input type="reset" value="重置" />
</form>
第8节 转义字符
<center>
image.png
网友评论