1:严格模式和混杂模式-如何区分这两种模式 区分他们有何意义？
定义：DOCTYPE标签是一种标准通用标记语言的文档类型声明，它的目的是要告诉标准通用标记语言解析器，它应该使用什么样的文档类型定义（DTD）来解析文档。支持html5标准的主流浏览器都认识这个声明。
（1）、<!DOCTYPE> 声明必须是 HTML 文档的第一行，位于 <html> 标签之前。
（2）、严格模式的排版和 JS 运作模式是 以该浏览器支持的最高标准运行。
（3）、在混杂模式中，页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
（4）、DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。
作用：声明文档的解析类型(document.compatMode)，避免浏览器的怪异模式。
2:常见的行内元素和块级元素有哪些?
行内: a em i strong b span
块级元素: div p ul li ol li dl hn
3:谈谈你对语义化的理解?
1、去掉或者丢失样式的时候能够让页面呈现出清晰的结构；
2、有利于SEO：和搜索引擎建立良好沟通，有助于爬虫抓取更多的有效信息：爬虫依赖于标签来确定上下文和各个关键字的权重；
3、方便其他设备解析（如屏幕阅读器、盲人阅读器、移动设备）以意义的方式来渲染网页；
4、便于团队开发和维护，语义化更具可读性。
4:em和i ,strong和b的区别?
<i>标签：
显示斜体文本效果
<i>标签告诉浏览器将包含其中的文本以斜体字（italic）或者倾斜（oblique）字体显示；
<em>标签：
<em>标签中的文本表示为强调的内容，对于所有浏览器的显示效果来说，是把这段文字用斜体来显示；
当引入新的术语或在引用特定类型的术语或概念时作为固定样式的时候，也可以考虑使用 <em> 标签。
- 锚点的作用是什么？如何创建锚点？
锚点是文档中某行的一个记号，类似于书签，用于链接到文档中的某个位置。当定义锚点后，我们可以创建直接跳至该锚点（比如页面中某个小节）的链接，这样使用者就无需不停地滚动页面来寻找他们需要的信息了。
在使用<a>元素创建锚点时，需要使用name属性为其命名，代码如下所示：
锚点一
然后就可以创建链接，直接跳转到锚点，代码如下所示：
<a href="#anchorname1">回到锚点一</a>
- 超级链接有哪些常见的表现形式？
<a>元素用于创建超级链接，常见的表现形式有：
普通超级链接。语法：
<a href="" target="">文本</a>
下载链接，即目标文档为下载资源。语法：
<a href="day.zip">下载</a>
电子邮件链接，用于链接到Email。语法：
<a href="mailo:1234546@qq.com">联系我们</a>
空链接，用于返回页面顶部。语法：
<a href="#">...</a>
3.[GET和POST两种基本请求方法的区别]
（1）GET比POST更不安全，因为参数直接暴露在地址栏上上，所以不能用来传递敏感信息。
（2）GET请求在地址栏中传送的参数是有长度限制的，而POST没有。
引入css的方式有几种？
1.行内样式
直接对HTML标签引入style=""设置样式；这样的方式会使得html不干净，代码冗余不利于维护。
2.内嵌样式
在head标签之间用标签声明
<style type="text/css">
body,div,a,img,p{margin:0; padding:0;}
</style>
优缺点：页面使用公共CSS代码，也是每个页面都要定义的，如果一个网站有很多页面，每个文件都会变大，后期维护难度也大，如果文件很少，CSS代码也不多，这种样式还是很不错的。
3.链接样式
链接样式使用最多，推荐使用的一种方法，在标签之间用<link …/>引入css文件
例如：
<link type="text/css" rel="stylesheet" href="style.css">
注：
rel是关联的意思，关联的是一个样式表(stylesheet)文档，它表示这个link在文档初始化时将被使用。
4.导入样式（不建议使用）
导入样式和链接样式比较相似，采用@import样式导入CSS样式表，在HTML初始化时，会被导入到HTML或者CSS文件中，成为文件的一部分，类似第二种内嵌样式。
@import在html中使用，如下：
<style type="text/css">
@import url(style.css);
</style>
@import在CSS中使用，如下：
@import url(style.css);
第二：四种CSS引入方式的优先级
1.就近原则
2.理论上：行内>内嵌>链接>导入
3.实际上：内嵌、链接、导入在同一个文件头部，谁离相应的代码近，谁的优先级高
单行文本水平垂直居中如何实现？
用text-align： center； 可实现文本水平居中
利用line-height等于height 行高等于高即可实现垂直居中，也可设置上下内边距padding相等，使文本垂直居中
day04面试题
1：哪些css属性是可以继承的属性？
答：主要的有：
字体相关：line-height, font-family, font-size, font-style, font-variant, font-weight, font
文本相关： letter-spacing, text-align, text-indent, text-transform, word-spacing
列表相关：list-style-image, list-style-position, list-style-type, list-style
还有一个比较重要的：color
2：选择器优先级如何计算？
行内样式>ID选择器>类选择器>标签>通配符>继承>浏览器默认属性
同一级别中后写的会覆盖先写的样式。
问题二：当不同类别的多个选择器混合使用个怎么计算优先级？
有一个简单的算法，设
a.内联样式表的权值为1000
b.ID选择器的权值为100
c.class类选择器的权值为10
d.HTML标签选择器的权值为1
3：简述css盒模型？
CSS盒子模型也叫做框模型，具备内容(content)、填充(padding)、边框(border)、边界(margin)这些属性。在CSS中，每一个元素都被视为一个框，而每个框都有三个属性：
border:元素的边框（可能不可见），用于将框的边缘与其他框分开；
margin：外边距，表示框的边缘与相邻框之间的距离，也称为页边空白；
padding:内边距，表示框内容和边框之间的空间。
width 和 height 指的是内容区域的宽度和高度。增加内边距、边框和外边距不会影响内容区域的尺寸，但是会增加元素框的总尺寸。
因此，如果在一个具有边框的元素中放置文本，往往需要设置一些内边距，以便文本的边缘不要接触边框，这样更便于阅读。而外边距则可以在多个元素框之间创建空白，避免这些框都挤在一起。因此，在设计页面时，经常会使用padding属性和margin属性来设置页面的布局。但是，必须注意的是，一旦用了padding属性或者margin属性设置了元素的边距以后，会增加元素在页面布局中所占的面积。
4:margin外边距常见问题及解决方法?
解决方法：
（1）为父盒子设置border，为外层添加border后父子盒子就不是真正意义上的贴合 （可以设置成透明：border：1px solid transparent）。
（2）为父盒子添加overflow：hidden；
（3）为父盒子设定padding值；
（4）为父盒子添加position：fixed；
（5）为父盒子添加 display：table；
如何让盒子水平垂直居中
方法一：margin:auto法
CSS代码：
div{
width: 300px;
height: 300px;
position: relative;
border: 1px solid #465468;
}
img{
position: absolute;
margin: auto;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
方法二：负margin法
CSS代码：
.container{
width: 500px;
height: 400px;
border: 2px solid #379;
position: relative;
}
.inner{
width: 480px;
height: 380px;
background-color: #746;
position: absolute;
top: 50%;
left: 50%;
margin-top: -190px; /*height的一半*/
margin-left: -240px; /*width的一半*/
简述BFC规则，及解决问题？
它是页面中的一块渲染区域，并且有一套渲染规则，它决定了其子元素将如何定位，以及和其他元素的关系和相互作用。
BFC(Block formatting context)直译为”块级格式化上下文”。它是一个独立的渲染区域，只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。
简述精灵图的原理及优缺点？
把网页中一些背景图片整合到一张图片文件中，在利用css的“background-image”，“background-repeat”“background-position”的组合进行背景定位，适用于一般小图标，不合适大背景图。
优点：减少http请求，提高性能
更好风格方便
缺点：必须限制容器大小符合背景图元素位置
简述网页中常见图片格式及特点？
1、GIF格式
该图形格式却在Internet上被广泛地应用，原因主要是256种颜色已经较能满足主页图形需要，而且文件较小，适合网络环境传输和使用。
2、JPEG格式
可以用不同的压缩比例对这种文件压缩，其压缩技术十分先进，对图像质量影响不大，因此可以用最少的磁盘空间得到较好的图像质量。由于它优异的性能，所以应用非常广泛，而在Internet上，它更是主流图形格式。
3、PSD格式（Photoshop格式）
Adobe公司开发的图像处理软件Photoshop中自建的标准文件格式就是PSD格式，在该软件所支持的各种格式中，PSD格式存取速度比其它格式快很多，功能也很强大。由于 Photoshop软件越来越广泛地应用，所以这个格式也逐步流行起来。PSD格式是Photoshop的专用格式，里面可以存放图层、通道、遮罩等多种设计草稿。
4、PNG格式
PNG（Portable Network Graphics）是一种新兴的网络图形格式，结合了GIF和JPEG的优点，具有存储形式丰富的特点。PNG最大色深为48bit，采用无损压缩方案存储。著名的Macromedia公司的Fireworks的默认格式就是PNG。
5、SVG格式(现在最火热的图像文件格式)
SVG是Scalable Vector Graphics 的首字母缩写，含义是可缩放的矢量图形。它是一种开放标准的矢量图形语言，可让你设计激动人心的、高分辨率的 Web图形页面。该软件提供了制作复杂元素的工具，如渐变、嵌入字体、透明效果、动画和滤镜效果，并且可使用平常的字体命令插入到HTML编码中。SVG被开发的目的是为Web提供非栅格的图像标准
为什么要初始化css样式？
由于浏览器兼容的问题，不同浏览器对标签的默认样式值不同，若不初始化会造成不同浏览器之间的显示差异
但是初始化会对搜索引擎优化造成小影响
html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？
新特性：
-
拖拽释放(Drag and drop) API
-
语义化更好的内容标签（header,nav,footer,aside,article,section）
-
音频、视频API(audio,video)
-
画布(Canvas) API
-
地理(Geolocation) API
-
本地离线存储 localStorage 长期存储数据，浏览器关闭后数据不丢失；
-
sessionStorage 的数据在浏览器关闭后自动删除
-
表单控件，calendar、date、time、email、url、search
-
新的技术webworker, websocket, Geolocation
移除的元素：
-
纯表现的元素：basefont，big，center，font, s，strike，tt，u；
-
对可用性产生负面影响的元素：frame，frameset，noframes；
支持HTML5新标签：
- IE8/IE7/IE6支持通过 document.createElement 方法产生的标签，可以利用这一特性让这些浏览器支持 HTML5 新标签，浏览器支持新标签后，还需要添加标签默认的样式（当然最好的方式是直接使用成熟的框架、使用最多的是html5shim框架）：
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
