什么是CSS盒子模型

  • 页面上的每个元素都被浏览器看做是一个矩形的盒子。
  • 由内容、填充、边框、边界组成。

什么是 css sprite

  • 将多个图片拼接在一个图片中,通过background-position和元素尺寸调节显示想要的背景的方案。
  • 优点:
    • 减少HTTP请求数,加快页面加载速度。
    • 提高压缩比、减少图片大小
    • 更换风格方便,只需在一张或者几张图片上修改颜色或者样式即可。
  • 缺点:
    • 图片合并麻烦
    • 维护麻烦,修改一个图片可能需要重新布局整个图片、样式

display:none; 于 visibility:hidden; 的区别?

  • 前者让元素在dom中消失,不占据空间,后者不会消失、并占据,只是内容不可见。
  • 前者是非继承的,父节点消失、子节点也会消失,后者相反,即使父节点消失,设置子节点为visibility: visible;可显现子节点。
  • 修改前者会造成文档重排,后者只会造成元素重绘。
  • 读屏器不会读取前者,会读取后者。

样式的优先级?

  • !important > style > id > class > 标签 > *

为什么被访问过的链接颜色没有变化?

  • 定义链接样式时,需要按照 :link、:visited、:hover、:active的顺序定义。

如何在点击文字时也选中checkbox?

  • 在input上设置id,并设置lable的 for属性为对应的id。

CSS3新增了哪些特性

  • 新的属性 box-shadow、text-shadow、border-image、background-clip等
  • 动画属性 transform、transition、animation等
  • 新的选择器 结构伪类、目标伪类、状态伪类等

前端开发面试题收集 css的更多相关文章

  1. 前端开发面试题收集(css部分)

    http://davidshariff.com/quiz/ 做了下这里面前端开发面试的题,发现有些不会,所以在此做个整理以供自己学习,参考,总结. 1.问: CSS属性是否区分大小写? ul { Ma ...

  2. 前端开发面试题收集 JS

    前端开发面试题收集-JS篇 收集经典的前端开发面试题 setTimeout的时间定义为0有什么用? javascript引擎是单线程处理任务的,它把任务放在队列中,不会同步执行,必须在完成一个任务后才 ...

  3. 前端开发面试题收集(html部分)

    1.问:<keygen>是正确的HTML5标签吗? 答:是. <keygen> 标签规定用于表单的密钥对生成器字段.当提交表单时,私钥存储在本地,公钥发送到服务器. 2.问:& ...

  4. 前端开发面试题收集 HTML

    Doctype是什么?说明特点. <!doctype>声明必须处于HTML文档的头部,在标签之前. <!doctype>声明不是一个HTML标签,是一个用于告诉浏览器使用哪种H ...

  5. 前端开发面试题收集(js部分)

    1.问:js中"1"+2+"3"+4 运算结果是? 答: js中,字符串和数值相加,得到的还是字符串,这里的结果1234也是字符串. 2.问:4+3+2+&qu ...

  6. 【理论面试篇】收集整理来自网络上的一些常见的 经典前端、H5面试题 Web前端开发面试题

    ##2017.10.30收集 面试技巧 5.1 面试形式 1)        一般而言,小公司做笔试题:大公司面谈项目经验:做地图的一定考算法 2)        面试官喜欢什么样的人 ü  技术好. ...

  7. 前端开发面试题-CSS(转载)

    本文由 本文的原作者markyun 收集总结. 介绍一下标准的CSS的盒子模型?低版本IE的盒子模型有什么不同的? (1)有两种, IE 盒子模型.W3C 盒子模型: (2)盒模型: 内容(conte ...

  8. 前端开发面试题-HTML(转载)

    本文由 本文的原作者markyun 收集总结了一些前端面试题,初学者阅后也要用心钻研其中的原理,重要知识需要系统学习.透彻学习,形成自己的知识链.万不可投机取巧,临时抱佛脚只求面试侥幸混过关是错误的! ...

  9. 前端开发面试题-JavaScript(转载)

    本文由 本文的原作者markyun 收集总结. 介绍js的基本数据类型. Undefined.Null.Boolean.Number.String. ECMAScript 2015 新增:Symbol ...

随机推荐

  1. android.view.InflateException: Binary XML file line #7: Error inflating class(OOM)

    由于页面含有ImageView引起的内存溢出. 作如下处理:在OnDestroy中 Drawable d = imageView.getDrawable(); if (d != null) d.set ...

  2. Python httplib学习

    httplib是python中http协议的客户端实现,可以使用该模块与HTTP服务器进行交互. 如示例1: import httplib url = "www.126.com"c ...

  3. XML的命名空间

    XML命名空间提供避免元素命名冲突的方法. 命名冲突:在XML中,元素名称是由开发者定义的,当两个不同的文档使用相同的元素名时,就会发生命名冲突. 这个XML文档携带着某个表格中的信息: <ta ...

  4. android Xml生成一条细线,以及获取屏幕宽度和高度

    <View android:layout_width="match_parent" android:layout_height="2dip" androi ...

  5. grok 正则解析日志例子<1>

    <pre name="code" class="html">下面是日志的样子 55.3.244.1 GET /index.html 15824 0. ...

  6. 12款最佳Linux命令行终端工具

    12款最佳Linux命令行终端工具 如果你跟我一样,整天要花大量的时间使用Linux命令行,而且正在寻找一些可替代系统自带的老旧且乏味的终端软件,那你真是找对了文章.我这里搜集了一些非常有趣的终端软件 ...

  7. Unix/Linux环境C编程入门教程(29) 内存操作那些事儿

    函数介绍 memccpy(拷贝内存内容) 相关函数 bcopy,memcpy,memmove,strcpy,strncpy 表头文件 #include<string.h> 定义函数 voi ...

  8. Activity和View的区别:

    Activity和View的区别: activity相当于控制部分,view相当于显示部分.两者之间是多对多的关系,所有东西必须用view来显示.  viewGroup继承自view,实现了ViewM ...

  9. JqueryeasyUI选项卡选择判定更改内部Iframe地址

    1.tabs的常用操作 //1.判断tab是否存在. var currtab = $('#tabs').tabs('getSelected'); //2.判断点击的tab是否是当前选中的tab. va ...

  10. poj 3753 Training little cats_矩阵快速幂

    题意: 通过各种操作进行,给第i只猫花生,第i只猫吃光花生,第i只猫和第j只猫互换花生,问n次循环操作后结果是什么 很明显是构建个矩阵,然后矩阵相乘就好了 #include <iostream& ...