枫芸志

又是一道前端的面试题，请实现页面布局，包括页头、内容区域、页脚三部分，其中内容区域为左右分栏，左栏定宽200px、右栏自适应宽度。

虽然是以前应用中碰到过的布局，但现场还是没写对，来重新做一下。

阅读全文…

以下为Web前端开发笔试题集锦之HTML/CSS篇，移步Javascript篇

1，让一个input的背景颜色变成红色

<input type="text" style="background:red;"/>

2，div的高宽等于浏览器可见区域的高宽，浏览器滚动，div始终覆盖浏览器的整个可见区域

思路：

(1)先放置一个div1，浮动：position:absolute;top:0px;left:0px;

(2)再放置一个div2，浮动：position:absolute;top:0px;left:0px;width:100%;height:100%;

(3)在div2中放置一个div3，令其高度超过浏览器高度，使div2产生滚动条

(4)对html,body进行样式设置：width:100%;height:100%;overflow:hidden->不让浏览器产生滚动条，避免页面出现两个滚动条

阅读全文…

一般情况下，图标总是事先做成图片然后直接拿来调用就行了。但是碰到一个状况需要做3分比例饼图，采用3种颜色标识不同内容在总体所占的比例，简单起见，所占比例为1/8的倍数。效果如下：

这样把每一个比例单独做个图，未免工作量过大，没算错的话需要做45个图；当然你可能会想到用程序去生成图，但也要会图像编程才行，这里先不考虑。

阅读全文…

默认情况下，table单元格之间是有间隔的。一般情况下，我们会利用table的cellpadding和cellpadding来清除默认样式，如下：

<table cellspacing="0" cellpadding="0"></table>

但这样做不仅增加了代码的体积，而且也极其不符合样式与内容分离的web标准，因此使用css控制cellspacing/cellpadding便有其意义。

阅读全文…

网页布局中会碰到需要某一个div有最小高度，超过最小高度后会自动扩展。比如某个div是有背景图的，高度小了背景图就不完整了影响效果。需要用到css中的min-height属性。

min-height属性的使用说明：

设置或检索对象的最小高度。如果此属性的值大于 max-height 属性的值，将会被自动转设为 max-height 属性的值。在IE6中这个属性仅仅作用于固定布局的表格内的 td 对象， th 对象， tr 对象。表格的默认布局是自动计算的，要得到固定布局的表格，设置表格的 table-layout 属性的值为 fixed 。固定布局的算法比默认的自动算法要快很多。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。 对应的脚本特性为 minHeight 。

阅读全文…

在网页上选中一段文字，选中的文字默认情况下是以蓝色背景+ 白色文字来显示的。看过一些网站，修改了选中文字的背景色，感觉十分清新，今天来查了一下怎么实现的。

上DEMO：

阅读全文…

设计选择字体时往往希望直接对比不同的字体效果来确定哪个字体更合适，而TypeTester就是这样的一个工具，而且能同时生成CSS样式。

TypeTester功能特色：

• 支持中文字体
• 三列效果样式、12种字体样式，方便对比效果
• 允许设置字体、字号、间距、颜色、背景、位置等属性
• 能生成CSS样式
• 操作便捷，使用方便

阅读全文…