码迷,mamicode.com
首页 > Web开发 > 详细

前端开发面试题准备html+css(上)

时间:2016-02-23 20:38:33      阅读:195      评论:0      收藏:0      [点我收藏+]

标签:

(1)如何理解web标准?

     web标准就是w3c标准,在1994年,为了研究web规范和方针,致力于web的发展,保证各种web技术协同发展。

     web标准的主要规范有:html,XML,XHTML,css,dom

     它的具体规范是:

  a.要求标签必须闭合,小写,不可乱嵌套

  b.建议使用外链css和脚本,实现结构与表现,结构与行为分离,从而方便检索,更快地显示页面;

  c.内容能被更多的用户所访问,内容能被更多的设备所访问,更少的代码和组件,容易维护;

(2)xhtml和html有什么区别

       HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言
       最主要的不同:
       XHTML 元素必须被正确地嵌套。
       XHTML 元素必须被关闭。
       标签名必须用小写字母。
       XHTML 文档必须拥有根元素。

(3)Doctype? 

        用于声明文档使用那种规范(html/Xhtml)

(4)行内元素有哪些?块级元素有哪些?CSS的盒模型?

        块级元素:div p h1 h2 h3 h4 form ul
        行内元素: a b br i span input select
        Css盒模型:内容,border ,margin,padding

5.CSS引入的方式有哪些?

     面中使用CSS的方式主要有3种:行内添加定义style属性值,页面头部内嵌调用和外面链接调用,其中外面引用有两种:link和@import。外部引用CSS两种方式link和@import      的方式分别是:

     XML/HTML代码
    <link rel="stylesheet" rev="stylesheet" href="CSS文件" type="text/css" media="all" />   
     XML/HTML代码
    <style type="text/css" media="screen">   
    @import url("CSS文件");   
    </style>  

    两者都是外部引用CSS的方式,但是存在一定的区别:

  区别1:link是XHTML标签,除了加载CSS外,还可以定义RSS等其他事务;@import属于CSS范畴,只能加载CSS。

  区别2:link引用CSS时,在页面载入时同时加载;@import需要页面网页完全载入以后加载。

  区别3:link是XHTML标签,无兼容问题;@import是在CSS2.1提出的,低版本的浏览器不支持。

  区别4:ink支持使用Javascript控制DOM去改变样式;而@import不支持。

 6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?

   css选择器大致分为两种:

   标签选择器(*是特殊情况),可但标签,也可上下文多标签;
   通用*+标签+多标签
   属性选择器(id和class都是属性,特殊的属性)
   id+class+属性(img[title])
   伪类,伪元素选择器
  :(:active :focus :hover :link :visited :first-child ) + ::before、:after
   i-c-e公式:
   行内(1000)但是现在很少这样写>id>class(伪类,类,属性)>元素(标签/伪元素)

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

   结构层 Html 表示层 CSS 行为层 js

8.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?
   Ie(Ie内核) 火狐(Gecko) 谷歌(webkit) opear(Presto)

9 标签上title与alt属性的区别是什么?.描述css reset的作用和用途?解释css sprites,如何使用?

   title:标题,

   alt:是图片不显示时的文字替代

   css reset:Reset重置浏览器的css默认属性 浏览器的品种不同,样式不同,然后重置,让他们统一

   Css 精灵 把一堆小的图片整合到一张大的图片上,减轻服务器对图片的请求数量

10.什么是语义化的HTML?
  直观的认识标签 对于搜索引擎的抓取有好处

11.清除浮动的几种方式,各自的优缺点
    1.使用空标签清除浮动 clear:both(理论上能清楚任何标签,,,增加无意义的标签)
   2.使用overflow:auto(空标签元素清除浮动而不得不增加无意代码的弊端,,使用zoom:1用于兼容IE)
   3.是用afert伪元素清除浮动(用于非IE浏览器)

12.你如何对网站的文件和资源进行优化?期待的解决方案包括:

   文件合并
   文件最小化/文件压缩
   使用CDN托管
   缓存的使用

13.浏览器标准模式和怪异模式之间的区别是什么

   盒子模型 渲染模式的不同
   使用 window.top.document.compatMode 可显示为什么模式

14写出你遇到的bug,以及你是怎么解决问题的?

超链接hover 点击后失效 使用正确的书写顺序 link visited hover active

前端开发面试题准备html+css(上)

标签:

原文地址:http://www.cnblogs.com/myFourLeaf/p/5210903.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!