Web前端面试题

时间:2024.3.31

[HTML&& CSS]

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

Doctype声明位于文档中的最前面的位置,处于标签之前。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。该标签可声明三种DTD 类型,分别表示严格版本、过渡版本以及基于框架的 HTML 文档。

当浏览器厂商开始创建与标准兼容的浏览器时,他们希望确保向后兼容性。为了实现这一点,他们创建了两种呈现模式:标准模式和混杂模式(quirks mode)。在标准模式中,浏览器根据规范呈现页面;在混杂模式中,页面以一种比较宽松的向后兼容的方式显示。混杂模式通常模拟老式浏览器(比如Microsoft IE 4和Netscape Navigator 4)的行为以防止老站点无法工作。

浏览器根据DOCTYPE是否存在以及使用的哪种DTD来选择要使用的呈现方法。如果XHTML文档包含形式完整的DOCTYPE,那么它一般以标准模式呈现。对于HTML 4.01文档,包含严格DTD的DOCTYPE常常导致页面以标准模式呈现。包含过渡DTD和URI的DOCTYPE也导致页面以标准模式呈现,但是有过渡DTD而没有URI会导致页面以混杂模式呈现。DOCTYPE不存在或形式不正确会导致HTML和XHTML文档以混杂模式呈现。

2.      行内元素有哪些?块级元素有哪些?

行内元素有:a b span I bem img input select strong

块级元素有:div ul ol lidl dt dd h1 h2 h3 h4…p

3.   画出CSS的盒模型?

盒模型:margin borderpadding width

4.      CSS引入的方式有哪些? link@import的区别是?

两者区别:加载顺序的差别。当一个页面被加载的时候,link引用的CSS会同时被加载,而@import引用的CSS会等到页面全部被下载完再被加载。@import可以在css中再次引入其他样式表,比如可以创建一个主样式表,在主样式表中再引入其他的样式表,如:

main.css

———————-

@import“sub1.css”;

@import“sub2.css”;

这样做有一个缺点,会对网站服务器产生过多的HTTP请求,以前是一个文件,而现在却是两个或更多文件了,服务器的压力增大,浏览量大的网站还是谨慎使用。

5.      前端页面由哪三层构成,分别是什么?作用是什么?
网页分成三个层次,即:结构层、表示层、行为层。
网页的结构层(structurallayer)由HTML 或XHTML 之类的标记语言负责创建。标签,也就是那些出现在尖括号里的单词,对网页内容的语义含义做出了描述,但这些标签不包含任何关于如何显示有关内容的信息。例如,P标签表达了这样一种语义:“这是一个文本段。”
网页的表示层(presentationlayer)由CSS 负责创建。CSS 对“如何显示有关内容”的问题做出了回答。
网页的行为层(behaviorlayer)负责回答“内容应该如何对事件做出反应”这一问题。这是Javascript 语言和DOM 主宰的领域。

7.      你做的页面通常在哪些流览器测试过?

8.      如何居中一个浮动元素?
设置容器的浮动方式为相对定位,然后确定容器的宽高,比如宽500 高 300 的层,然后设置层的外边距。
div{Width:500px;height:300px;Margin: -150px 0 0-250px;position:relative;left:50%;top:50%;}

9.      有没有关注HTML5CSS3?如有请简单说一些您对它们的了解情况!
HTML5标签的改变:<header>,<footer>, <dialog>, <aside>, <figure>, <section> 等
IE9以上开始支持
CSS3实现圆角,阴影,对文字加特效,增加了更多的CSS选择器。

10.   如果让你来制作一个访问量很高的大型网站,你会如何来管理所有CSS文件、JS与图片?


第二篇:web前端面试题


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

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”

“/TR/xhtml1/DTD/xhtml1-strict.dtd”>

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”

“/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

2:行内元素有哪些?块级元素有哪些?CSS的盒模型与CSS布局中的每一个元素的关系是?

行内元素:

块级标签:

CSS的盒模型:

3.CSS引入的方式有哪些? link和@import的区别是?

4.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?

5:前端页面有哪三层构成,分别是什么?作用是什么?

6: css的基本语句构成是?

7:你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?经常遇到的浏览器的兼容性有哪些?怎么会出现?解决方法是什么?

8.如何居中一个浮动元素?

9.是否关注HTML5和CSS3? 如有请简单说一些对它们的了解

10:如果让你来制作一个访问量很高的大型网站,你会如何来管理调优所有CSS文件、JS与图片?

11:你对前端界面工程师这个职位是怎么样理解的?它的前景会怎么样?

12:js是什么,js和html 的开发如何结合?

13. Javascript怎样添加、移除、移动、复制、创建和查找节点

14.怎样使用事件? IE和DOM事件模型之间存在哪些主要差别是?

15.面向对象编程:b怎么继承a

16.看看下面alert的结果是什么

function b(x, y, a)

{

arguments[2] = 10;

alert(a);

}

b(1, 2, 3);

如果函数体改成下面,结果又会是什么?

a = 10;

alert(arguments[2] );

17.请编写一个JavaScript函数 parseQueryString,它的用途是把URL参数解析为一个对象

var obj = parseQueryString(url);

alert(obj.key0) // 输出0

18.ajax是什么? ajax的交互模型? 同步和异步的区别? 如何解决跨域问题?

19.什么是javascript闭包? 下面这个ul,如何点击每一列的时候alert其index? <ul id=”test”>v

<li>001</li><li>002</li><li>003</li>

</ul>

20.常使用的库有哪些? 常用的前端开发工具? 开发过什么应用或组件?

更多相关推荐:
WEB前端面笔试题总结

1如何显示隐藏一个DOM元素更改元素的cssstyle设为displaynone此外还可以将visibility设为hidden透明度设为0或长宽设为02一个定宽网页在浏览器IE6IE7FirefoxIE5中横...

web前端笔试题面试题汇总+前端优化总结

前端是庞大的包括HTMLCSSJavascriptImageFlash等等各种各样的资源前端优化是复杂的针对方方面面的资源都有不同的方式那么前端优化的目的是什么1从用户角度而言优化能够让页面加载得更快对用户的操...

前端面试笔试题总结

JavaScript类库jQueryPrototypeJavaScript框架BackBoneVuejsAngularjsReactjsCSS预编译器LessCssSassJavaScript模块加载器Requ...

前端面试题总结

1.!DOCTYPE标签的定义与用法。DOCTYPE声明是指HTML文档开头处的一行或两行代码,它描述使用哪个DTD(documenttypedefinition)。DOCTYPE通常——但不总是——包含指定的…

前端笔试面试题目总结

希望对一起奋战找工作的战友们有帮助列举3个以上http请求头响应头有哪些字段列举5个以上http的响应状态消息有哪些值列举4个以上说明解析ajax的意思同步和异步的区别异步请求有哪些状态如何创建一个异步请求异步...

前端工程师面试试题

20xx年最新前端开发面试题Thelasttimethatrefresh20xx113123757本文主要是由于我最近在找前端开发职位所以总结了一些常见前端面试多数来源于网络希望看的朋友阅后也要用心钻研其中的原...

20xx年最新前端开发面试题(题目列表+答案 完整版)

前言本文总结了一些优质的前端面试题多数源于网络初学者阅后也要用心钻研其中的原理重要知识需要系统学习透彻学习形成自己的知识链万不可投机取巧只求面试过关是错误的面试注意点1面试题目根据你的等级和职位变化入门级到专家...

前端面试题

HTMLCSS1行内元素有哪些块级元素有哪些他们各有什么特性块级元素divph1h2h3h4formul行内元素abbrispaninputselect2DIV的盒模型Contentpaddingborderm...

20xxweb前端面试题

HTMLCSS1对WEB标准以及W3C的理解与认识标签闭合标签小写不乱嵌套提高搜索机器人搜索几率使用外链css和js脚本结构行为表现的分离文件下载与页面速度更快内容能被更多的用户所访问内容能被更广泛的设备所访问...

web前端面试题

前端面试之菜锅语录1JavaScript高级程序设计事件模型盒子模型闭包原型2前端优化雅虎那几十条3算法快速排序4在写页面的时候遇见的兼容性问题5问你项目中的与前端有关的不会的不要写6数组去重7http状态码例...

CSS前端面试题

CSSDIV网页制作面试题超经典一填空题40分1目前常用的WEB标准静态页面语言是xhtml4分2改变元素的外边距用margin改变元素的内填充用padding6分3在Table中TR是行TD是列6分4如果给一...

web前端面试题

1Doctype严格模式与混杂模式如何触发这两种模式区分它们有何意义ltDOCTYPEhtmlPUBLICW3CDTDXHTML10TransitionalENTRxhtml1DTDxhtml1strictdt...

前端面试题总结(26篇)