HTML&CSS常见面试题及疑难解答

对web标准以及W3C的理解与认识?

WEB标准不是某一个标准,而是一系列标准的集合。网页主要由三部分组成:结构(Structure)、表现(Presentation)和行为(Behavior)。

对应的标准也分三方面:结构化标准语言主要包括XHTML和XML,表现标准语言主要包括CSS,行为标准主要包括对象模型(如W3C DOM)、ECMAScript。

或者说:

web标准简单来说可以分为结构、表现和行为。其中结构主要是有HTML标签组成。或许通俗点说,在页面body里面我们写入的标签都是为了页面的结构。表现即指css样式表,通过css可以是页面的结构标签更具美感。行为是指页面和用户具有一定的交互,同时页面结构或者表现发生变化,主要是有js组成。

W3C的理解:

W3C对web标准提出了规范化的要求,也就是在实际编程中的一些代码规范:包含如下几点

1.对于结构要求:(标签规范可以提高搜索引擎对页面的抓取效率,对SEO很有帮助)

1)标签字母要小写

2)标签要闭合</>

3)标签不允许随意嵌套

2.对于css和js来说

1)尽量使用外链css样式表和js脚本。是结构、表现和行为分为三块,符合规范。同时提高页面渲染速度,提高用户的体验。

2)样式尽量少用行间样式表,使结构与表现分离,标签的id和class等属性命名要做到见文知义,标签越少,加载越快,用户体验提高,代码维护简单,便于改版

3)不需要变动页面内容,便可提供打印版本而不需要复制内容,提高网站易用性。

2.xhtml和html有什么区别?

最主要的区别就是xhtml比HTML的规范更严格

最主要的不同具体表现在:

XHTML 元素必须被正确地嵌套。

XHTML 元素必须被关闭。

标签名必须用小写字母。

XHTML 文档必须拥有根元素。

【课堂延伸】

xhtml与html严格意义上其实没什么区别,xhtml1.0的开发实际上是作为html4.01与xml2.0的一个过渡的网页版本而存在的,因为xml的解析语法过于苛刻,简单一句话就是:只要网页中出现一处错误,则浏览器停止解析。几年前,按照w3c的计划xhtml1.0的下一个版本来应该是xhtml 2.0的,但因为xhtml 2.0的语法苛刻程度已经是xml的苛刻程度了,但是xml违背了网页设计的一个基本原理,即“发送时要保守,接收时要开放。”,于是xhtml2.0项目最终流产,被html5所取代。

3.说说你常用的几种浏览器测试,并说出有哪些内核

(Q1)浏览器:IE,Chrome,FireFox,Safari,Opera。

(Q2)内核:Trident,Webkit Gecko, Webkit Presto,。

【课堂衍生】

如果解决浏览器css新特性兼容问题

就必须在前面加上相关浏览器的前缀

-webkit谷歌

-o欧朋

-moz火狐

推荐解决浏览器兼容的文章:

http://www.cnblogs.com/lgmcolin/archive/2013/02/12/2910179.html

4.Doctype? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义?

(1)、<!DOCTYPE>声明位于文档中的最前面,处于<html>标签之前。告知浏览器的解析器,用什么文档类型规范来解析这个文档。

(2)、严格模式的排版和 JS 运作模式是以该浏览器支持的最高标准运行。

(3)、在混杂模式中,页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。

(4)、DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。

参考地址:http://www.cnblogs.com/wuqiutong/p/5986191.html

http://blog.csdn.net/binglingnew/article/details/17301433

5.什么是语义化的HTML?

直观的认识标签对于搜索引擎的抓取有好处,用正确的标签做正确的事情!

html语义化就是让页面的内容结构化,便于对浏览器、搜索引擎解析;

在没有样式CCS情况下也以一种文档格式显示,并且是容易阅读的。搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重,利于 SEO。

使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解。

详细解说参考链接:http://www.cnblogs.com/freeyiyi1993/p/3615179.html

6.HTML5 为什么只需要写 !DOCTYPE HTML?

HTML5 不基于 SGML(标准通用标记语言),因此不需要对DTD进行引用,但是需要doctype来规范浏览器的行为(让浏览器按照它们应该的方式来运行);而HTML4.01基于SGML,所以需要对DTD进行引用,才能告知浏览器文档所使用的文档类型。

7.html5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和HTML5?

HTML5 现在已经不是 SGML 的子集,主要是关于图像,位置,存储,多任务等功能的增加。

绘画 canvas

用于媒介回放的 video 和 audio 元素

本地离线存储 localStorage 长期存储数据,浏览器关闭后数据不丢失;

sessionStorage 的数据在浏览器关闭后自动删除

语义化更好的内容元素,比如 article、footer、header、nav、section

表单控件,calendar、date、time、email、url、search

新的技术webworker, websockt, Geolocation

移除的元素

纯表现的元素:basefont,big,center,font, s,strike,tt,u;

对可用性产生负面影响的元素:frame,frameset,noframes;

支持HTML5新标签:

IE8/IE7/IE6支持通过document.createElement方法产生的标签,

可以利用这一特性让这些浏览器支持HTML5新标签,

浏览器支持新标签后,还需要添加标签默认的样式:

详细参考链接网址:http://www.html5jscss.com/html5-semantics-section.html

Canvas 的用法 (主要是用来画图) https://developer.mozilla.org/zh-CN/docs/Web/API/Canvas_API

Canvas 自带的属性width和height,该元素有getContext()的方法,这个方法是用来获得上下文和它的绘画功能.

function draw(){

var canvas=document.getElementById(‘canvas‘);

if(canvas.getContext){

var ctx=canvas.getContext(‘2d‘);

ctx.beginPath();

ctx.arc(75,75,50,0,Math.PI*2,true);

ctx.moveTo(115,75);

ctx.arc(75,75,35,0,Math.PI,false);

ctx.moveTo(65,65);

ctx.arc(60,65,5,0,Math.PI*2,true);

ctx.moveTo(95,65);

ctx.arc(90,65,5,0,Math.PI*2,true);

ctx.stroke();

}

}

时间: 2024-11-07 02:09:19

HTML&CSS常见面试题及疑难解答的相关文章

HTML常见面试题及疑难点解答

HTML&CSS常见面试题及疑难解答 HTML篇 对web标准以及W3C的理解与认识? WEB标准不是某一个标准,而是一系列标准的集合.网页主要由三部分组成:结构(Structure).表现(Presentation)和行为(Behavior). 对应的标准也分三方面:结构化标准语言主要包括XHTML和XML,表现标准语言主要包括CSS,行为标准主要包括对象模型(如W3C DOM).ECMAScript. 或者说: web标准简单来说可以分为结构.表现和行为.其中结构主要是有HTML标签组成.或

JAVA常见面试题及解答-java开发

JAVA常见面试题及解答 Java的垃圾回收总结  浅谈Java中的内部类 1)transient和volatile是java关键字吗? 如果用transient声明一个实例变量,当对象存储时,它的值不需要维持.例如: class T { transient int a;  //不需要维持 int b;  //需要维持 } 这里,如果T类的一个对象写入一个持久的存储区域,a的内容不被保存,但b的将被保存. volatile修饰符告诉编译器被volatile修饰的变量可以被程序的其他部分改变.在多

【转载】JAVA常见面试题及解答(精华)

JAVA常见面试题及解答(精华) 1)transient和volatile是java关键字吗?(瞬联) 如果用transient声明一个实例变量,当对象存储时,它的值不需要维持.例如: class T { transient int a;  //不需要维持 int b;  //需要维持 } 这里,如果T类的一个对象写入一个持久的存储区域,a的内容不被保存,但b的将被保存. volatile修饰符告诉编译器被volatile修饰的变量可以被程序的其他部分改变.在多线程程序中,有时两个或更多的线程共

一些html5和css3的一些常见面试题

最近总结了一些有关于html5和css3的一些常见面试题,希望对正在找工作的你有所帮助. 还有欢迎大家补充~~~ 一.HTML5 CSS3 CSS3有哪些新特性? 1. CSS3实现圆角(border-radius),阴影(box-shadow), 2. 对文字加特效(text-shadow.),线性渐变(gradient),旋转(transform) 3.transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9de

好程序员web前端分享HTML5常见面试题集锦四

好程序员web前端分享HTML5常见面试题集锦四1.为什么要初始化CSS样式?答案:因为浏览器的兼容问题,不同浏览器对有些标签的默认值是不同的,如果没对CSS初始化往往会出现浏览器之间的页面显示差异.当然,初始化样式会对SEO有一定的影响,但鱼和熊掌不可兼得,但力求影响最小的情况下初始化.2.浮动元素引起的问题?答案:a. 父元素的高度无法被撑开,影响与父元素同级的元素b. 与浮动元素同级的非浮动元素会跟随其后c. 若非第一个元素浮动,则该元素之前的元素也需要浮动,否则会影响页面显示的结构3.l

java主线程等待所有子线程执行完毕在执行(常见面试题)

java主线程等待所有子线程执行完毕在执行(常见面试题) java主线程等待所有子线程执行完毕在执行,这个需求其实我们在工作中经常会用到,比如用户下单一个产品,后台会做一系列的处理,为了提高效率,每个处理都可以用一个线程来执行,所有处理完成了之后才会返回给用户下单成功,下面就说一下我能想到的方法,欢迎大家批评指正: 用sleep方法,让主线程睡眠一段时间,当然这个睡眠时间是主观的时间,是我们自己定的,这个方法不推荐,但是在这里还是写一下,毕竟是解决方法 2.使用Thread的join()等待所有

linux系统运维企业常见面试题集合(三)

linux系统运维企业常见面试题集合(三) 01  写一个sed命令,修改/tmp/input.txt文件的内容,要求:(1) 删除所有空行:(2) 一行中,如果包含"11111",则在"11111"前面插入"AAA",在"11111"后面插入"BBB",比如:将内容为0000111112222的一行改为:0000AAA11111BBB2222 [[email protected]~]# cat -n /t

asp.net常见面试题(一)

1.索引器 1 class Player 2 { 3 private int[] arr = new int[100]; 4 public int this[int index] 5 { 6 get { 7 if (index < 10 || index >= 10) 8 { 9 return 0; 10 } 11 else 12 { 13 return arr[index]; 14 } 15 } 16 set { 17 if (!(index < 0 || index >= 10

iOS 多线程 自动释放池常见面试题代码

同步:代码依次执行,一个人执行多个任务,也是依次执行.一个人在同一时间只执行一个任务 异步:可以同时执行多个任务 进程:指在系统中运行的应用程序,每个进程都是独立的,都有独立的且安全的运行空间 线程:一个进程可以有多个线程,但只有一个主线程.进程的任务都是在线程里面完成的. 进程,线程与多线程之间的关系? 进程=公司     线程 = 员工    多线程 = 老板 多线程可以解决程序阻塞问题,也可以提高程序的执行效率 自动释放池常见面试题代码 p.p1 { margin: 0.0px 0.0px