WEB标准的三种组成：经典面试题
主要包括结构（Structure）、表现（Presentation）和行为（Behavior）三个方面。
结构：结构对于网页元素进行整理和分类，咱们主要学的是HTML.（排版。结构没有图片）
表现：表现用于设置网页元素的版式、颜色、大小等外观样式，主要指的是CSS，（加入CSS,变成静态页面）
行为：行为是指网页模型的定义及交互的编写，咱们主要学的是Javascript.（动画）
（交互：和用户进行交互）

换行和P的区别：  
<br /> 换行之后没有间距相当于Enter
<p>   <p/>  换行之后有段落间距

在新窗口打开原来的还在
在插入的图片后面或者网址后面添加targe标签
eg：<a  target="_blank"> 连接对象</a>

在新窗口打开原来的还在
在插入的图片后面或者网址后面添加targe标签
eg：<a  target="_blank"> 连接对象</a>

绝对路径  带有D盘 G盘等不能用

锚点定位：实现页面内部的跳转
1.先把需要快速跳跃到的地址  命名一下  
2.然后再回去需要添加定位的或者跳跃的地方插入锚点定位的代码
第一步：<h2 id="02">第3集</h2>
第二步：<a href="#02">第3集</a><br />

bast标签----所有标签都是在新窗口打开
预格式化文本  pre

表格代码：
<table> </table>   大的框
<tr>  </tr>行
<td> </td>小的方框 填入数据

placeholder： 占位符：鼠标放在附近就可以输入

列表：
无序列表  <ul></ul>   <li></li>
有列表  <ol></ol>   <li></li>
自定义列表
<dl>
  <dt>----</dt>
  <dd>---<dd>
  <dd>---<dd>
  <dd>---<dd>
<dl>

文本框          用户名：<input type="text" placeholder="请输入名字">
   
密码文本框    密码：<input type="password"  placeholder="请输入密码">  

单选按钮      性　别：男 <input type="radio" name="sex" checked="checked">
                         女<input type="radio" name="sex">
复选框按钮   爱　好：
                <input type="checkbox" name="habiit">睡觉
                <input type="checkbox" name="habiit">打游戏
                <input type="checkbox" name="habiit">看电视
                <input type="checkbox" name="habiit">等等
                <input type="checkbox" name="habiit">吃饭
插入图片按钮：   <input type="image"  src="images/btn(1).png">

CSS部分：

CSS中数值之后都会带一个单位：PX

1，行内样式：写在开始标签身上
没有实现结构与样式的分离 尽量不要用
2，内部嵌套：写在head之间  
还是在HTML里面写的 没有实现样式和结构的分离
3，外部链接：最好用以后工作中常用
新建一个CSS，，然后用link链接到html中，实现结构与样式的分离
rel：关系
sytlesheet:样式关系
herf：路径，相对路径  实际工作中用的都是相对路径

CSS的注释：写CSS的时候得用CSS的注释 格式是/* ----*/
如果写完出现bug 可能是因为注释不对

CSS的选择器:
基础选则器
标签选择器：  实际工作中 不推荐使用  缺点：全部选择不能差异设计样式
类选择器（重点：实际工作中最常用）
ID选择器：(写静态页面用不到，写JS会用到）
区别：
在于选择次数上  类别选择器中一个.名称可以多次使用 ID名称只能用一次用于唯一性的选择器上 和后面的JS搭配使用
写样式类别选择器用的最多，写JS 用ID选择器最多
通配符选择器:示所有的标签，只要在sty*表le中写了*这个属性 所有的内容都会运用该属性，包含body内容

综合性写法：是否倾斜、是否加粗、文字大小、行高、字体
其中文字大小，字体不能省略

并集选择器：重点
标签和类名之间用逗号隔开
样式相同的时候，可以用逗号隔开标签和类名  逗号就是和的意思

实际工作中设置一个总体的a  表示所有的样式一样4个状态一直
然后在单独设置一个a hover  单独设置鼠标滑过是变色

背景平铺：
平铺：background-image：repeat、
不平铺：background-image：no-repeat
横向平铺：background-image：repeat-x
纵向平铺：background-image：repeat-y

背景位置：精确单位：  第一个数值肯定是X轴的数值，第二个是Y轴的数值
不论是数值 还是center/left/right混用 都是第一个是X值 第二个是Y值
→：（10px； center）&（center；10px）不一样

层叠性：多种重叠样式的叠加：
重叠效果：
1.样式冲突   先写的被重叠掉
2.不冲突的不会重叠 ，
继承性
子元素会继承父级元素的属性
a标签是不能继承父级的属性的

CSS布局的三种机制：
普通流 :
行内元素盒子装不下会自动变到下一行
              行内元素：span  i  a  em
浮动 （float） :让多个盒子一行显示消除间隙 也可以保留间隙-----移动到指定的位置；
定义：让盒子定位在浏览器的某一个位置；

会改变dispalay属性：  
         之前是块级元素浮动之后变成行内块元素，盒子显示的大小为行内元素的大小
         block转换为inline-block
父级盒子装不下小盒子 会自动换到下一行

浮动效果的体现：一个标准流的父级盒子+浮动的盒子  +定位

WEB标准的三种组成：经典面试题
主要包括结构（Structure）、表现（Presentation）和行为（Behavior）三个方面。
结构：结构对于网页元素进行整理和分类，咱们主要学的是HTML.（排版。结构没有图片）
表现：表现用于设置网页元素的版式、颜色、大小等外观样式，主要指的是CSS，（加入CSS,变成静态页面）
行为：行为是指网页模型的定义及交互的编写，咱们主要学的是Javascript.（动画）
（交互：和用户进行交互）

换行和P的区别：  
<br /> 换行之后没有间距相当于Enter
<p>   <p/>  换行之后有段落间距

在新窗口打开原来的还在
在插入的图片后面或者网址后面添加targe标签
eg：<a  target="_blank"> 连接对象</a>

在新窗口打开原来的还在
在插入的图片后面或者网址后面添加targe标签
eg：<a  target="_blank"> 连接对象</a>

绝对路径  带有D盘 G盘等不能用

锚点定位：实现页面内部的跳转
1.先把需要快速跳跃到的地址  命名一下  
2.然后再回去需要添加定位的或者跳跃的地方插入锚点定位的代码
第一步：<h2 id="02">第3集</h2>
第二步：<a href="#02">第3集</a><br />

bast标签----所有标签都是在新窗口打开
预格式化文本  pre

表格代码：
<table> </table>   大的框
<tr>  </tr>行
<td> </td>小的方框 填入数据

placeholder： 占位符：鼠标放在附近就可以输入

列表：
无序列表  <ul></ul>   <li></li>
有列表  <ol></ol>   <li></li>
自定义列表
<dl>
  <dt>----</dt>
  <dd>---<dd>
  <dd>---<dd>
  <dd>---<dd>
<dl>

文本框          用户名：<input type="text" placeholder="请输入名字">
   
密码文本框    密码：<input type="password"  placeholder="请输入密码">  

单选按钮      性　别：男 <input type="radio" name="sex" checked="checked">
                         女<input type="radio" name="sex">
复选框按钮   爱　好：
                <input type="checkbox" name="habiit">睡觉
                <input type="checkbox" name="habiit">打游戏
                <input type="checkbox" name="habiit">看电视
                <input type="checkbox" name="habiit">等等
                <input type="checkbox" name="habiit">吃饭
插入图片按钮：   <input type="image"  src="images/btn(1).png">

CSS部分：

CSS中数值之后都会带一个单位：PX

1，行内样式：写在开始标签身上
没有实现结构与样式的分离 尽量不要用
2，内部嵌套：写在head之间  
还是在HTML里面写的 没有实现样式和结构的分离
3，外部链接：最好用以后工作中常用
新建一个CSS，，然后用link链接到html中，实现结构与样式的分离
rel：关系
sytlesheet:样式关系
herf：路径，相对路径  实际工作中用的都是相对路径

CSS的注释：写CSS的时候得用CSS的注释 格式是/* ----*/
如果写完出现bug 可能是因为注释不对

CSS的选择器:
基础选则器
标签选择器：  实际工作中 不推荐使用  缺点：全部选择不能差异设计样式
类选择器（重点：实际工作中最常用）
ID选择器：(写静态页面用不到，写JS会用到）
区别：
在于选择次数上  类别选择器中一个.名称可以多次使用 ID名称只能用一次用于唯一性的选择器上 和后面的JS搭配使用
写样式类别选择器用的最多，写JS 用ID选择器最多
通配符选择器:示所有的标签，只要在sty*表le中写了*这个属性 所有的内容都会运用该属性，包含body内容

综合性写法：是否倾斜、是否加粗、文字大小、行高、字体
其中文字大小，字体不能省略

并集选择器：重点
标签和类名之间用逗号隔开
样式相同的时候，可以用逗号隔开标签和类名  逗号就是和的意思

实际工作中设置一个总体的a  表示所有的样式一样4个状态一直
然后在单独设置一个a hover  单独设置鼠标滑过是变色

背景平铺：
平铺：background-image：repeat、
不平铺：background-image：no-repeat
横向平铺：background-image：repeat-x
纵向平铺：background-image：repeat-y

背景位置：精确单位：  第一个数值肯定是X轴的数值，第二个是Y轴的数值
不论是数值 还是center/left/right混用 都是第一个是X值 第二个是Y值
→：（10px； center）&（center；10px）不一样

层叠性：多种重叠样式的叠加：
重叠效果：
1.样式冲突   先写的被重叠掉
2.不冲突的不会重叠 ，
继承性
子元素会继承父级元素的属性
a标签是不能继承父级的属性的

CSS布局的三种机制：
普通流 :
行内元素盒子装不下会自动变到下一行
              行内元素：span  i  a  em
浮动 （float） :让多个盒子一行显示消除间隙 也可以保留间隙-----移动到指定的位置；
定义：让盒子定位在浏览器的某一个位置；

会改变dispalay属性：  
         之前是块级元素浮动之后变成行内块元素，盒子显示的大小为行内元素的大小
         block转换为inline-block
父级盒子装不下小盒子 会自动换到下一行

浮动效果的体现：一个标准流的父级盒子+浮动的盒子  +定位