玫瑰余香fly-CSDN博客

原创表单美化至--复选框

复选按钮.typelist{width: 500px;height: 30px;border: 1px solid #dfdfdf;border-width: 1px 0;margin: 20px auto 0;overflow: hidden;padding-left: 20px;font: 12/22 "微软雅黑";}.checklist li{float: left;padd

2015-05-20 15:07:53 476

原创弹出框如何跳出iframe

主页面代码：主页面function tip() {alert(123)}//-->子页面代码：

2014-09-04 10:10:49 2341

原创 CSS3那些不为人知的高级属性

尽管现代浏览器已经支持了众多的CSS3属性，但是大部分设计师和开发人员貌似依然在关注于一些很“主流”的属性，如border-radius、box-shadow或者transform等。它们有良好的文档、很好的测试并且最常用到，所以如果你最近在设计网站，你很难能脱离它们。但是，隐藏在浏览器的大宝库中是一些高级的、被严重低估的属性，但是它们并没有得到太多的关注。或许它们中的一些应该这样(被无视)，

2014-08-07 13:54:28 532

转载 css3 media媒体查询器用法总结

随着响应式设计模型的诞生，Web网站又要发生翻天腹地的改革浪潮，可能有些人会觉得在国内IE6用户居高不下的情况下，这些新的技术还不会广泛的蔓延下去，那你就错了，如今淘宝，凡客，携程等等公司都已经在大胆的尝试了这项技术，并完美的应用在了自己的网站上了。再不更新知识你就老了。我今天就总结一下响应式设计的核心CSS技术Media(媒体查询器)的用法。准备工作1：设置Meta标签

2014-06-13 09:11:01 903

转载 javascript的map()方法

map()方法：对数组的每个元素调用定义的回调函数并返回包含结果的数组。

2014-06-12 10:03:23 458

原创自适应网页设计 --入门浅析

随着3G的普及，越来越多的人使用手机上网。移动设备正超过桌面设备，成为访问互联网的最常见终端。于是，网页设计师不得不面对一个难题：如何才能在不同大小的设备上呈现同样的网页？手机的屏幕比较小，宽度通常在600像素以下；PC的屏幕宽度，一般都在1000像素以上（目前主流宽度是1366×768），有的还达到了2000像素。同样的内容，要在大小迥异的屏幕上，都呈现出满意的效果，并不

2014-06-10 10:56:31 461

原创在PC上测试移动端网站和模拟手机浏览器的5大方法

详细出处参考：http://www.jb51.net/softjc/144941.html

2014-05-22 09:50:29 2720

Chrome浏览器以其简单、快速、安全、稳定、扩展丰富等特性受到了不少人的喜爱，除了这些特性，Chrome浏览器还提供了非常简单方便的开发人员工具，可以为开发提高效率，加上Chrome浏览器对HTML5和CSS3的支持度相对比较好，很多web新技术在Chrome浏览器上的呈现效果都很不错，不少web设计和开发人员对Chrome浏览器也情有独钟，不少web设计和开发人员甚至表示Chrome已经成为他

2014-05-19 10:08:57 786

原创杂技

1.lang表示当前文档显示的语言。

2014-05-15 16:07:31 469

原创 xmlns详解

xmlns是XML Namespaces的缩写，中文名称是XML（标准通用标记语言的子集）命名空间。

2014-05-15 13:57:07 1971

原创 js读书心得（第四章表达式和运算符）

第4章1.表达式原始值：常量、或者直接量、关键字。（truefalse null this）2.在一个方法体内，this返回调用这个方法的对象。3.对象直接量中的属性值可以是字符串而非标识符。（这在那些只能使用保留字，或者使用非法标识符作为属性名的地方非常有用。）4.对象用中括号访问属性，中括号里的属性名需要加引号。O.[“x”]5.当属性名是通过计算得出的值而不是固定的值的

2014-04-23 11:32:42 559

原创 js读书心得3

第3章1.对象是属性的集合，属性有名/值对构成。（数组、函数是特殊的对象）2.js类：数组类、函数类、日期类、正则类、错误类。3.负号是一元求反运算符，并不是数字直接量语法的组成部分。4.16进制的前缀是0X或者0x5.全局变量 Infinity NaN6.判断x是否为NaN：x!=x此表达式只有当x是NaN时才为ture。NaN和任何值都不相等，包括自身。7.二进制浮

2014-04-21 10:19:20 540

转载你是否彻底了解margin属性？

写css，你少不了与margin打交道。你真的了解margin吗？你知道margin有什么特性吗？你知道什么是垂直外边距合并？margin在块元素、内联元素中的区别？什么时候该用padding而不是margin？你知道负margin吗？你知道负margin在实际工作中的用途吗？常见的浏览器下margin出现的bug有哪些？……Margin是什么CSS 边距属性定义元素周围的空间。通

2014-04-15 09:38:58 711

原创 js读书心得2

第二章2.11.Unicode为每种语言的每个字符设定了统一并且唯一的二进制编码，以满足跨语言、跨平台进行文本转换的、处理的需求。2.html不区分大小写，js区分大小写。3.js转义序列以\u为前缀。4.js的标识符可以以字母，下划线，和美元的$开始，不可以是数字。通常用字母和数字来写标识符。5.“（”和“【”可能会跟前边的语句解析在一起，导致错误，所以为了保险起见可以在

2014-04-11 10:11:32 437

原创 js读书心得1

1.ctrl+shift+J唤醒错误控制台。2.变量是表示值的一个符号名字，用var声明。1.1js语言核心1.事件处理程序：事件处理程序是一个在浏览器中注册是js函数，当特定类型的事件发生时，浏览器便调用这个函数。2.load事件Load事件只有等文档加载完成后才会触发。通常要等到load事件完成后才开始执行js代码。？？？？？？？？？？？？？？？？？？？？？？？？？

2014-04-09 16:50:29 556

转载浏览器模式与文档模式的区别

简单来说，“浏览器模式”影响的是浏览器的版本及IE的条件注释， ”浏览器模式”会影响服务器端对浏览器版本的判断,主要表现在展现，对CSS影响很大简单来说，“浏览器模式”影响的是浏览器的版本及IE的条件注释， ”浏览器模式”会影响服务器端对浏览器版本的判断,主要表现在展现，对

2014-04-03 14:03:20 566

原创什么是闭包

1.闭包是起函数的作用并且可以向对象一样操作的对象。

2014-04-03 11:34:41 556

转载函数式编程

sscv

2014-04-03 11:20:07 604

原创只用于块级元素的css

1.text-incident：-10px文本首行缩进的意思，现在好多都用于使文本缩进到页面之外。只是这个css只用于块级元素，所以需要给使用他的元素加上display：block；或者float：left；

2014-03-17 16:59:43 500

转载手机网站页面制作更应该符合WEB标准

导读：国内手机网站目前还算是个新鲜事物，相应的手机网站前端开发也并不是特别成熟，对于一个网页设计师来说要做一个手机网站还是会碰到许多问题，本文转载自淘宝 UED，分享如何开发进行手机网站的前端卡发。从09年初接手淘宝手机网站前端开发的工作至今，转眼已是一年。一步步看着手机淘宝从最初的beta版本到今天的样子，感慨良多。手机网站开发，有着许多不为人知的困难：一是可参考的资料太少，大部分

2014-03-11 10:18:10 841

原创 li列表第二列无法正常显示问题

笔者前几天遇到一个比较诡异的问题，用li做的列表，正常情况下没问题，加上当前状态的背景也没问题，除了第一行最后一个li，如图：开始以为是最后一个文档流没有断开，影响了第二行显示，其实不然，加了当前类的li向上走了，导致下一个li在他下边，解决办法是：使他像上走的高度变小，是高度与其他li一直，（有透明看不出来高度，可以用加背景色的办法区分演示）以下是整个代码：css代码

2014-01-24 18:12:04 688

转载 CSS3 Flexible Boxes display：flex

设计一个网站，布局可能是最生要的元素之一。当你网站的用户理解你的布局和喜欢上你的网站布局，他们用起来很开心，这样用户会在你的站点呆的时间更长，甚至会定期访问你的网站。我们通过导航能浏览一些高质量的内容，但由于网站混乱的设计和完全乱套的布局，我们第一反应，那就是尽可能快的离开这个网站。从小屏幕（240px）到超大的屏幕（1920px以上）,没有一个标准的布局可以适合这些不同屏幕的尺寸。到目前

2013-12-16 17:21:59 1387

原创 html常用特殊字符（备用）

html常用特殊字符：源代码显示结果描述<小于号或者显示标记>>大于号或者显示标记&&可用于显示其他字符"；引号®®已注册©©版权™™商标&ensp

2013-12-02 16:42:29 727

转载一个简单的html5来回拖放的例子w3c

例子代码如下：拖放.container { border: 1px solid #CCC; width:324px; height:324px; float:left;}.content { background-color: #FAA; width:324px; height:324px; float:le

2013-11-18 16:54:40 1037

原创笔者总结的一些前端面试笔试试题（仅供参考，如果错误，望指教）--2

1. 请用css实现如下效果，图片在div水平垂直居中显示。（Div的宽和高都是200px,图片的宽和高多小于200像素，在正方形容器中水平和垂直居中显示）Html如下：#box { height:200px; width:200px; display:table-cell; vertical-align:middle;/*火狐，ch

2013-10-31 21:48:36 885

原创 CSS三栏布局（两边固定中间自适应宽度）的方法

-　　在讲这种布局之前，我还想和大家一起回想一下三列布局中的另一种，就是左右两列固定、中间自适应宽度。这种布局方法，网上问问G爸和度娘一定会有一大堆，但我还是要重复说说，方便自己今后查阅，记性太差，没办法。别的先不说了，就开始进入主题吧。　　第一种方法：　　对于两边固定中间一列自适应的布局方法，我最早使用的是绝对定位法。先看代码：左边栏右边栏

2013-10-31 10:47:37 2454

原创 div代码居中上下居中左右居中

Universal vertical center with css#outer {height:300px;width:300px;overflow:hidden;position:relative;text-align:center;}#outer[id]{display:table;position:static;}#middle{po

2013-10-31 10:16:24 1709

原创笔者总结的一些前端面试笔试试题（仅供参考，如果错误，望指教）--1

1. strict和transitional两种文档声明模式有何区别意义？如何声明html5？(xhtml的w3c标准规定所有的标签必须闭合，所有的属性必须加引号。)strict是严格模式，transitional是过度模式。Strict文档声明模式，它不支持表现层的属性和标签，将结构和表现分开，使得维护一个站点非常容易.。Transitional是更加宽容的规范。如

2013-10-31 09:52:16 717

原创什么是网页重绘与回流

页面呈现流程在讨论页面重绘、回流之前。需要对页面的呈现流程有些了解，页面是怎么把html结合css等显示到浏览器上的，下面的流程图显示了浏览器对页面的呈现的处理流程。可能不同的浏览器略微会有些不同。但基本上都是类似的。 1. 浏览器把获取到的html代码解析成1个Dom树，html中的每个tag都是Dom树中的1个节点，根

2013-10-09 17:15:34 1055

原创区别div和span

二者都是用来划分区间但是没有实际语义的标签，默认都没有对元素内的对象进行格式化渲染，主要应用于样式表。div是块级元素，不会和其他元素在统一行；而span是行内元素，可以与其他元素在统一行。

2013-10-08 16:08:11 539

原创 jquery ui 代码重写（还没想到更好说法，暂时这么叫吧）

下面是本人临摹jquery ui 页面写的，这个过程对本人有很大启发，建议有时间的人，都自己看一遍。css框架body{ font:62.5% "微软雅黑", "黑体","Trebuchet MS",sans-serif; margin:50px; }.demoHeaders{ margin-top:2em;}#dialog-link{ text-decor

2013-09-23 14:35:52 1593 2

转载浅析AngularJS

什么是 AngularJS AngularJS是为了克服HTML在构建应用上的不足而设计的。HTML是一门很好的为静态文本展示设计的声明式语言，但要构建WEB应用的话它就显得乏力了。所以我做了一些工作（你也可以觉得是小花招）来让浏览器做我想要的事。通常，我们是通过以下技术来解决静态网页技术在构建动态应用上的不足：类库 - 类库是一些函数的集合，它能帮助你写WEB应

2013-09-18 11:21:58 1723 1

原创使文本显示省略号的样式

text-overflow属性配合其他属性可实现省略号效果：text-overflow:ellipsis;white-space:nowrap;overflow:hidden;text-overflow属性仅是注解，当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。要实现溢出时产生省略号的效果还须定义：强制文本在一行内显示（white-space:nowrap）及溢出内容为隐藏（o

2013-09-12 15:48:50 706

原创一段冻结表头的代码

本人写了一段冻结表头的代码，此代码兼容IE7、8，firefox，chrome浏览器，其他浏览器待测。现将此代码粘贴于此：冻结表头*{ padding:0px; margin:0px; font-family:"微软雅黑", "黑体"; font-size:12px; color:#262626;}.tb{ margin:20px;}.tb_header_wra

2013-09-12 14:08:38 787

转载 clip:rect('top', 'right', 'bottom', 'left')

clip属性检索或设置对象的可视区域。区域外的部分是透明的。必须将position的值设为absolute，此属性方可使用。依据上-右-下-左的顺序提供自对象左上角为(0,0)坐标计算的四个偏移数值，其中任一数值都可用auto替换，即此边不剪切。示例：clip:rect(auto 50px 20px auto);说明：上边不剪切，右边从第50个像素开始剪切直至最右边，下

2013-08-28 09:05:32 939

转载研究Html中自定义属性（一）

研究Html中自定义属性（一）HTML标签可以自定义属性，但是我们要考虑其在IE、Firefox以及chrome下的兼容性问题。例如：这里的“myAttr”就是这个标签的自定义属性了。如果定义了属性却使用不了，那么这个属性就没有任何意义了，接下来就是如何去调用我们的自定义属性的值了。在IE浏览器里，我们通过获取对象后直接调用就可以了

2013-08-26 11:33:31 920

原创动态切换图片（改变src属性值）

动态改变HTML图像(动态改变的src属性值/*function imageChange() {img = document.getElementById('imgChang')if(img.src.match("bulboff")){img.src = "images/eg_bulbon.gif"}else {img.src = "images/eg_bu

2013-08-21 11:55:11 2725

原创网页宽度随显示器宽度变化而变化

$(function(){var w =window.screen.width *0.8;$(".white_bg").width(w);$(".header").width(w);$(".main_nav").width(w);$(".main_func").width(w);})

2013-07-23 15:19:15 741

原创 css hack技巧

利用Css Hack技术方便独立控制某种浏览器的具体样式，可以有效控制 CSS 在不同浏览器的表现，避免撰写多个 CSS 文件。一、常用Css Hack写法1. * 符号IE 浏览器能识别 * 符号，但其他浏览器诸如 Firefox、Opera、Chrome 等不能识别 * 符号。例：在 Firefox 和 IE 中呈现不同的文字颜色：.box{ color:red; *color

2013-07-15 14:32:23 1070

原创遍历对象属性的方法

function DisplayPropertyNames(obj) {var names = "";for( var name in obj){names +=name +"\n"};alert(names);}var oTest = {nameT:"张三",age:24,sex:"女"}DisplayPropertyNames(oTest)//-

2013-07-12 15:34:59 740

空空如也

空空如也