一、HTML与XHTML的不同:1)XHTML元素必须被正确地嵌套

2)元素必须被关闭   如:<h1>……</h1>关闭

3)标签名必须用小写字母

4)XHTML文档必须有根元素

二、盒子模型:CSS框模型(BOX Model)规定了元素框处理元素内容、内边距、边框、和外边距的方式,俗称盒子模型。

三、多列布局分为:圣杯布局和双飞翼布局

双飞翼布局(常用)和圣杯布局的相同点和不同点:

相同点:1)中间栏放最前面(最先加载)

2)每一部分都要浮动(float)

3)左边:margin-left:-100%

右边:margin-left:负的右边栏的定宽   如右边栏宽度为200px,则margin-left值为-200px

不同点:解决中间栏不被遮挡的思路不一样

1.圣杯布局是通过padding的方式让出空间,再通过相对定位position:relative;将其推到两边。

2.双飞翼布局是通过创建一个子的div方式,在中间栏设置margin-left 和 margin-right 留出位置。

 附:    1、圣杯布局:多列布局的变种,边栏定宽,主体在一定范围内可自适应,并且优先加载

实现思路:1)设置主容器div的padding(根据边栏位置设置left、right)和overflow(hidden)。

2)在主容器中先添加主体,再添加边栏。

3)设置主体width为100%(可适应浏览器窗口大小变化),

float 为left(为边栏定位做准备)。

4)设置边栏,position采用relative ,左边栏需设置margin-left为-100%使其移动到主体前面

以及left属性;右边栏设置margin-left为负的右边栏定宽以及right属性。

web前端开发面试题(未完待续)的更多相关文章

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

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

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

    编写一个方法 求一个字符串的字节长度假设:一个英文字符占用一个字节,一个中文字符占用两个字节 function GetBytes(str){ var len = str.length; var byt ...

  3. web前端开发面试题(Vue.js)

    1.active-class是哪个组件的属性?嵌套路由怎么定义? 答:vue-router模块的router-link组件. 2.怎么定义vue-router的动态路由?怎么获取传过来的动态参数?  ...

  4. web前端开发面试题(答案)

    1.xhtml和html有什么区别? HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言最主要的不同:XHTML 元素必须被正确地嵌套.XHTML 元素必须被关闭.标签名必须 ...

  5. Web前端开发面试题

    1. 以下的代码有问题吗?如果有你觉着应该如何修改? for(int i=0; i<list.size(); i++) {  .....  .....  if(...)  {   list.re ...

  6. Web前端开发面试题赋答案

    第一部分:用CSS实现布局 让我们一起来做一个页面 首先,我们需要一个布局. 请使用CSS控制3个div,实现如下图的布局. 第二部分:用javascript优化布局 由于我们的用户群喜欢放大看页面 ...

  7. web前端开发面试题(附答案)-3

    1.用纯css创建一个三角形的原理: .demo{ width:0; height: 0; border: 5px solid transparent; border-left-color: red; ...

  8. web前端开发面试题(附答案)-2

    1.label是什么标签,有什么作用?和for属性使用的作用? label标签来定义表单控制间的关系,当用户选择该标签时,浏览器会自动将焦点转到和标签相关的表单控件上. label 元素不会向用户呈现 ...

  9. web前端开发面试题(附答案)-1

    1.浏览器中输入url到网页显示,整个过程发生了什么 域名解析 发起tcp三次握手 建立tcp连接之后发起htttp请求 服务器端响应http请求,浏览器得到html代码 浏览器器解析html代码,并 ...

随机推荐

  1. [1] Entity Framework

    开发框架之Entity Framework  

  2. Redis数据类型之Set

          前言:set类似于数学上面的集合概念,包含的元素无序,不能重复,能进行交.并.差操作. 一.内部原理              set数据结构,也是随着元素数目的多少而变化.当set中添加 ...

  3. 转 使用HAProxy,PHPRedis,和MySQL支撑10亿请求每周架构细节

    [编者按]在公司的发展中,保证服务器的可扩展性对于扩大企业的市场需要具有重要作用,因此,这对架构师提出了一定的要求.Octivi联合创始人兼软件架构师Antoni Orfin将向你介绍一个非常简单的架 ...

  4. Scrapy爬虫大战京东商城

    Scrapy爬虫大战京东商城 引言 上一篇已经讲过怎样获取链接,怎样获得参数了,详情请看python爬取京东商城普通篇 代码详解 首先应该构造请求,这里使用scrapy.Request,这个方法默认调 ...

  5. fdisk 非交互式创建 分区

    一. key 非交互式创建分区, 与 交互式创建分区区别不大. 使用 fdisk 的默认选项, 使用空行即可, 不用回车. 创建 主分区 和 扩展分区时, 需要注意 分区号 二. 创建主分区 fdis ...

  6. CSS中的尺寸单位

    绝对单位 px: Pixel 像素 pt: Points 磅 pc: Picas 派卡 in: Inches 英寸 mm: Millimeter 毫米 cm: Centimeter 厘米 q: Qua ...

  7. h5之scrollIntoView控制页面元素滚动

    如果滚动页面也是DOM没有解决的一个问题.为了解决这个问题,浏览器实现了一下方法,以方便开发人员如何更好的控制页面的滚动.在各种专有方法中,HTML5选择了scrollIntoView()作为标准方法 ...

  8. 30岁程序员的选择,一线OR二线?

    作为一个30刚出头的IT行业从业者,先介绍下我自己的情况.虽然不具有代表性,但是也可以作为一个参考.本人08年本科毕业于一所还算不错的211大学计算机专业(04年去的时候综合排名38,毕业走时排名45 ...

  9. jmeter3.2版本完美实现Load Test报表

    今天下载了最新版的apache tomcat jmeter 3.2,需要jdk1.8以上的版本. 用非GUI模式运行压力测试后,出现的报表太完美了. 将jmx脚本放在就jmeter_home下的Scr ...

  10. Hibernate执行原生态sql语句

    @Override public Integer update(String id, String username){ String sql = "update Team_CheLiang ...