- 博客(38)
- 收藏
- 关注
RSS订阅原创 fieldset宽度撑开解决方案
今天上午，测试发现设置里面树状结构展开后会撑开fieldset。fieldset父节点已经设置了宽度400，但当展开的branch长度超过一定范围时，发现设置的宽度不起作用。fieldset在没有内部元素时，是以block方式解析的，即外部100%宽度自适应；继承父类的宽度400本应当维持这个宽度了，为何会被撑宽呢？因为它的min-width属性，在CSS的属性的权重中，min-wid...
2020-04-07 10:05:48
770
原创 移动前端工作的那些事---前端制作篇之meta标签篇
移动端前端制作有些地方不同于互联网，这篇主要讨论的是meta标签。meta标签位于head标签之间。是主要辅助HTML结构层的。meta标签不管在互联网前端还是在移动端都起了很重要的作用。这里只讨论移动端。附上代码进行说明：xxx复制代码这是一个HTML5为语言标准的说明
2015-07-16 11:00:27
584
原创 css3阴影属性box-shadow
css3阴影属性box-shadow的一些注意点:box-shadow:阴影水平偏移值（可取正负值）； 阴影垂直偏移值（可取正负值）；阴影模糊值；阴影颜色；Firefox支持Box Shadow(阴影)：-moz-box-shadow:2px 2px 5px #333333；webkit内核的Safari和Chrome支持Box Shadow(阴影)：-webkit-box-shadow:
2013-09-10 15:16:58
948
原创 IE下模拟css3中的box-shadow（阴影）
在ie下模拟css3中的box-shadow（阴影）可以使用ie的Shadow（阴影）滤镜基本语法：filter: progid:DXImageTransform.Microsoft.Shadow(color=’颜色值’, Direction=阴影角度（数值）, Strength=阴影半径（数值）);注意：该滤镜必须配合background属性一起使用，否则该滤镜失效。IE下模拟css
2013-09-10 15:16:51
795
原创 导航跟随滚动条置顶移动
#topmenu{position:absolute;top:100px;background:#4b4a4a;width:100%;margin:0 auto;clear:both;overflow:hidden;z-index:998;left:0} jQuery(document).ready(function() { var topmenu =
2013-08-02 15:28:32
7658
原创 优秀网页设计微博汇总
2013年07月11日的@优秀网页设计微博汇总：【大师们笔下的美妙设计作品】http://e.weibo.com/1773655610/zFy3i2854【获奖名单公布】http://e.weibo.com/1773655610/zFxJz2YPK【一针见血的品牌定位】http://e.weibo.com/1773655610/zFxygFGwW【PS高
2013-07-12 09:47:06
753
转载 如何更好的在自动化行业中立足？ ---- 从了解品牌开始
工厂生产产品；顾客购买品牌。产品可以被竞争对手复制；品牌却是独一无二的。产品可以很快过时；成功的品牌却可以经久不衰。—— 史蒂芬.金，英国伦敦WPP集团很多人的观点认为，在自动化和自动控制这个市场中主要是靠集成商、中间商去做市场，大型系统级产品是靠关系拿下大客户，而小型通用型产品本身区别小，与品牌关系不大，"不做品牌照样销售"成为很多自动化企业不做品牌的最冠冕堂皇的理由。但是，在瞬
2013-07-11 15:42:08
1232
原创 tab切换，适用于多个tab切换
tab切换* { padding:0; margin:0}body { font-size:12px}ul, li, ol { list-style:none}a { text-decoration:none}.clearfix { clear:both; overflow:hidde
2013-07-11 11:21:53
7375
原创 Bootstrap前端开发框架
Bootstrap简洁、直观、强悍的前端开发框架，让web开发更迅速、简单http://www.bootcss.com/
2013-07-11 11:03:11
970
原创 下拉框select
Untitled Document* { padding:0; margin:0}body { font-size:12px}.select_box { background: url("images/select_bg.gif") no-repeat scroll left top transparent; color
2013-07-11 10:54:58
756
原创 模拟select取值ul li
jQuery(function($){ var selDOM = function(obj){ for(var i=0;i var items = jQuery(obj[i]); for(var k=0;k (function(){ var arrDOM = [""], item = jQuery(it
2013-01-12 14:43:44
1017
原创 模拟select成ul li展示
jQuery(function($){ var selDOM = function(obj){ for(var i=0;i var items = jQuery(obj[i]); for(var k=0;k (function(){ var arrDOM = [""], item = jQuery(items[k]);
2012-12-26 12:40:10
3385
原创 ($(this).offset().top
$(document).ready(function(){ $('.cate_share_box ul li').addClass(function() { return 'item_' + jQuery(this).index(); }); var mouseoverDiv=jQuery('.cate_share_box li.two
2012-11-08 17:05:02
6324
原创 让IE支持HTML5元素作为CSS选择器
IE6、IE7、IE8不支持HTML5，IE9开始支持HTML5，这就导致我们无法在IE6/IE7/IE8中使用HTML5元素作为CSS选择器。利用下面的脚本可以解决这个问题，需要注意的是这个脚本需要在页面渲染以前执行。XML/HTML Code复制内容到剪贴板> script type="text/javascript"> (function(){
2012-10-31 10:10:43
692
原创 yahoo雅虎网站的优化原则
如果你已经对yahoo这些优化建议烂熟于心，果断点这里一、 Yahoo的军规条例：谨记：80%-90%的终端响应时间是花费在下载页面中的图片，样式表，脚本，flash等；详细的解释来这里查：http://developer.yahoo.com/performance/rules.html也可以直接firebug上一项项比对，如下图：简单翻译解释下：1、尽量减少HTTP请
2012-10-24 16:54:35
1449
原创 jquery.lazyload 实现图片延迟加载jquery插件
Lazy Load延迟加载也有的称为惰性加载，是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预加载的处理方式正好是相反的.在包含很多大图片长页面中延迟加载图片可以加快页面加载速度. 浏览器将会在加载可见图片之后即进入就绪状态. 在某些情况下还可以帮助降低服务器负担
2012-10-24 16:16:25
5840
1
原创 轮播切换效果+点击放大图
效果如下：css如下：/*============新品============*/img{border:0 none}.more_pro .moreandmore{text-align:left;width:404px;}.more_pro .moreandmore .more_bt{margin:0 auto 0 30px;width:111px;height:40p
2012-08-27 11:55:46
7370
原创 前端开发工程师目前局势是非常辛苦的
前端开发辛苦的原因是什么，我不知道在你日夜奋战div+CSS的时候思考过没有。就我的经验，前端的辛苦在于以下几个方面： ◎ 重复劳动多，大量的div+css都是重复的，即便可以复制粘贴，但几千行的div海洋中去寻找一个入口恐怕都非常痛苦 ◎ 需求变更多，往往你折腾几个小时终于把跨平台问题解决好了，而且在IE6、7和Firefox下面都能显示同样的效果了，甚至连JavaScr
2012-08-18 11:01:54
2980
3
原创 解决PNG图片在IE6下的透明问题
.pngs { width:57px; height:56px; position:absolute; top:105px; left:103px; background:url(../images/png.pn
2012-05-29 11:44:51
464
原创 table中设置border-collapse属性
CSS border-collapse 属性定义和用法border-collapse 属性设置表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示浏览器支持所有主流浏览器都支持 border-collapse 属性。注释：任何的版本的 Internet Explorer （包括 IE8）都不支持属性值 "inherit"。注释：如果没有规定
2012-04-23 10:39:14
2181
原创 bgiframe 解决IE6 DIV 挡不住下拉选择框
在做项目测试的时候发现一个bug，select老是跑在浮动层上面，浮动层div怎么也不能浮在select最上面一层，那么如何让浮动的div层显示在select组件的上面呢？找了些资料发现原来这就是html语言的通病，只能通过某些优先级更高的组件来遮盖解决，下面是解决办法。bgiframe 插件用来轻松解决 IE6 z-index 的问题，如果网页上有浮动区块和下拉选单重叠时，在IE6会看到下拉
2012-04-13 17:27:07
917
原创 点击top回滚到顶部和窗口浮动跟随鼠标上下移动
TOP图片：id="toTop" src="images/scroll_to_top.gif" width="38" height="68" alt="Scroll to Top" title="Scroll to Top" />点击TOP回滚到顶部js如下：jQuery.noConflict();(function($) { var ScrolltoTop = $("#toT
2012-04-13 16:25:59
3499
原创 CSS链接
将CSS样式表加入到网页时，分为以下几种方法：1.将样式表内嵌到HTML文件中； 是指样式文件写入到标签之内，一般用于访问量比较大的页面，通过减少HTTP请求数而减轻服务器的负担。 缺点：需要修改时之内对其所在页面进行修改，所以的样式表信息均列于HTML文件的顶部。 …… 2.将一个外部样式表链接到HTML文件中； 在维护
2012-04-11 17:10:13
561
原创 CSS优先级
原则一：继承不如指定；原则二：ID选择器优先级大于类别选择器，类别选择器大于标签选择器；原则三：越具体级别越高；原则四：标签#id优先级大于#id，标签.class大于.class。
2012-04-11 16:44:26
723
原创 图片上下滚动
1 2 var $$$ = function (id) { return "string" == typeof id ? document.getElementById(id) : id;};var Class = { create: function() { return function() { this.in
2012-04-01 15:44:59
564
原创 最小高度设置
min-height:600px;height:auto !important;height:600px;overflow:visible;
2012-04-01 15:42:45
458
原创 加入收藏
收藏本站jQuery(document).ready(function() { jQuery(".addcollect").click(function() { var ctrl = (navigator.userAgent.toLowerCase()).indexOf('mac') != -1 ? 'Command/Cmd': 'CTRL';
2012-04-01 15:41:39
601
原创 去掉点击a出现的虚线边框
去掉点击a出现的虚线边框各个浏览器兼容方法：a{ hide-focus: expression(this.hideFocus=true); /* for ie 5+ */ outline: none; /* for firefox 1.5 + */ }
2012-04-01 15:36:18
576
原创 10条影响 CSS 渲染速度的写法与建议(下)
6、CSS的路径别太深；例如：1#bd #info #tool #sidebar h2{font-size:12px;}7、能简写的一些就简写；例如：1#bd{pading-top:1em;padding-right:2em;padding-bottom:3em;padd
2012-03-19 11:57:48
429
原创 10条影响 CSS 渲染速度的写法与建议(上)
这篇文章主要写的提高网页在客户端浏览器的渲染速度的 CSS 部分。1、*{} #bd *{} 尽量避开由于不同浏览器对 HTML 标签的解释有所差异，所以最终的网页效果在不同的浏览器中可能也是不一样的，为了消除这方面的风险，设计者通常会在 CSS 的一开始就把所有标签的默认属性全部去除，以达到所有签标属性值都统一的效果。所以就有了 * 通配符。 * 会遍历所有的标签；
2012-03-19 11:47:05
616
原创 psd to html 开发步骤
其实标准的网页制作实际就是：psd to html，一般情况下，我们开始 psd to html 的时候需要从两个大点考虑。一、一个独立的页面根据PSD设计稿，分析整个网页的结构。分析背景图片和ICO图标的分布。切割相应的图片，导出，合并图片（即CSS Sprites）。编写XHTML结构代码，包括页面中出现的所有元素。根据XHTML代码和PSD
2012-03-19 11:15:33
727
原创 网站设计布局中常犯的错误
div+css 网页布局是目前最流行的语言，也是国际变化的趋势，合理的应用可以让你的网站给人眼前一亮的感觉，不过在布局中也应该注意以下一些错误，及时纠正，一个成功的网站就离你不远了。1、导航菜单使用图片、flash导航菜单使用图片、flash 当然比纯文本来得好看一些，但是搜索引擎并不认识你的图片和 flash 。如果你非要使用漂亮的flash 来做导航的话。建议做一个导航菜单链接的 xm
2012-03-19 09:57:49
658
1
翻译 CSS float 浮动属性详解
什么是 CSS float ？float 是 CSS 的定位属性。在传统的印刷布局中，文本可以按照需要围绕图片。一般把这种方式称为“文本环绕”。在网页设计中，应用了 CSS 的 float 属性的页面元素就像在印刷布局里面的被文字包围的图片一样。浮动的元素仍然是网页流的一部分。这与使用绝对定位的页面元素相比是一个明显的不同。绝对定位的页面元素被从网页流里面移除了，就像印刷布局里面的文本
2012-03-19 09:47:54
1892
原创 fireworks网页图片导出优化
很多同学都搞不明白，这么多图片格式，什么情况用什么格式图片。我在这里就简单分享下我的经验。原则：保证图片不失真的前提下，以最小的图片大小来导出图片。目前我们网络上普遍使用的图片格式分为JPG、GIF、PNG-8、PNG-32(PS中的PNG24)。具体图片格式的原理，我就不说了，大家可以去度娘查询下。我只说明什么情况使用什么格式，以及它们的优缺点。JPG：一般来说，大型
2012-03-19 09:30:58
2442
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人