流放之忆 发表于 七月 14th, 2008 | 分类:
前端制作
CSS书写:
filter:alpha(opacity=80);
opacity:0.8;
其中filter为IE6的私有属性;
opacity为CSS3的属性,目前标准浏览器如Firefox、Safari都支持。但是Opera 9.0版本后才支持。
数值中IE的80和CSS3里的0.8是相同的,即百分比和小数.
——————————
如果你用的IE7,那么会发现这些代码是无效的。
——神奇的微软,在IE7及以上版本里连自家的filter也不可用了,但是也不支持CSS3。所以这种办法在IE7无效。
问题出在每个页面顶部的DTD上,有兴趣的可以阅读DOCTYPE声明相关的文档。
这里可以通过另外种办法来实现:透明PNG背景图。可以给父容器设置半透明的PNG背景图来实现上面效果。各个标准浏览器都支持(前面提到的Opera 9.0之前不支持opacity,但是他支持PNG透明),IE7也开始支持。
遗憾的是,IE6不支持,但是有JS可以使IE6也支持透明PNG。
暂无评论
流放之忆 发表于 七月 14th, 2008 | 分类:
前端制作
如果采用默认的表单样式,那么不同的操作系统,同一操作系统的不同版本,甚至Windows的皮肤外观,以及不同的浏览器,都会对表单组件采用不同的样式解析。
一.INPUT
1.1 type=”text” 文本输入框
input的高度和文字字号默认一般都是16px。加上边框,18px.
Firefox下,不可以用line-height定义input,所以需要通过微调padding来设置文字垂直居中。
1.2 type=”submit”
XP的submit很不厚道,文字多了会马赛克
二.SELECT
select直接定义宽度,会和同样宽度的input有5像素的偏差。(猜测是右边的下拉箭头的宽度)
select不可以直接定义宽高边框外的样式。需要用JS实现,比较著名的就是niceform美化组件。
三.TEXTAREA
- textarea用默认的字数和行数设置大小,IE和Firefox下不同。推荐直接CSS定义width和height。美中不足的是少了字数和行高两个属性,DW里会提示语法错误。
- textarea有默认的字号。不想输入的文字看上去跟外面12px的不协调的话,就预置掉。
- FF下没有右边滚动条,IE下无论何时都会有的;
- 见一些网站是使用input代替的textarea,但是换行问题不知道怎么解决的。问过同事,得知可以写程序加入换行;
-
另外,表格中,td定义text-indent,FF中文字和输入框都可以缩进,IE下输入框不会缩进
更多搜集中
暂无评论
流放之忆 发表于 七月 13th, 2008 | 分类:
前端制作
对理论没兴趣的,可以只看红色标注的结论
mozilla的工程师dbaron发表过一篇演讲,提到reflow的问题。概念不难理解
mozilla系列浏览器构建网页的过程:
- 1、读取HTML文档,构建网页文档树——就是从body开始到结束,把每个table或者div记录下来
- 2、reflow——通过CSS或者其他因素计算文档树中每个对象的大小、布局等
- 3、把计算结果显示在屏幕上
简单言之浏览器的运算开销大多在reflow这一步,就是获取对象的布局、排版等样式,如果样式的定义有误则浏览器会重新运算,之后再展现在浏览器上。
另外通过JS来覆写对象的样式是比较典型的一种销毁原样式并重建的过程,这种销毁和重建,都会增加浏览器的开销。其中CSS方面,常用的JS切换display:none和display:block是个最好的例子
而HTML文档中,比较典型的是图片的宽高未定义,浏览器会自行计算,所以很多网页优化的文章都列入了这条,即可能的话,就把图片的宽度高度
写进HTML文档里。
从渲染过程上来讲,mozilla有过CSS的书写建议:
- 1.显示样式
- display/position/float/clear
- 2.自身样式
- width/height/margin/padding/border/background
- 3.内容样式
- line-height/text-align/font系列(font-size/font-weight)/color/text-decoration/vitical-align
猜测这应该和mozilla系列浏览器本身渲染网页的优先级顺序切合。
我的书写顺序好像是很早前从一叶千鸟那里学的
select{clear:both;display:block;float:left;margin:100px;padding:100px;width:100px;height:100px;line-height:100px;text-align:center;color:#000;font-size:12px;font-weight:400;background:#FFF;border:1px solid #F00;)
大致符合建议规则,同时因为书写样式时修改频率最高的就是背景和边框,所以放在最外面,取了规则和工作效率的平衡点。
暂无评论
流放之忆 发表于 七月 7th, 2008 | 分类:
互联网
工作的切身感受就是网站的同质化,直接复制已有的业界知名网站,表象有三个:
1.复制版块划分
成功的行业网站在成长过程中已经根据业界的实际运作情况对信息及服务进行了划分,具有普适性。并且也通过自身的划分,对业界自身产生约定俗成的影响,即形成了客户习惯。
所以这部分的复制或者说参考,如同炳叔在回复“满地都是SNS”的时候所说,不创新,不等于,不成功。
2.信息(包括商机信息)的完全复制。
初创业的团队没有充裕的人力进行第一手信息的发掘——事实上,可能网站投资者通过自身优势,在业界内已经有产生一定的影响力,有人员的话去采编并不难——所以经常会转载信息来充实网站。
然而在缺乏留住客户的手段的前提下,转载的信息带来的作用,只是填充网站,以及提高搜索引擎排名。公司网站上线后我仅仅递交了下sitemap,三个月后在 Google上搜索行业关键词就跳到第一页,超越了目前业内实际上的No.1。然而,这个数字起到的作用只是满足下老板的虚荣心,并不能带来任何的转化。
单纯的转载业界信息期望客户来点击甚至以这些信息留下客户,是很飘渺的事。除非,可以像豆瓣那样自动匹配买卖双方的需求,并想办法主动推送匹配结果给客户。
3.功能模块复制
对于行业网站的主要受众群体——企业——来讲,对于新网站的体验欲望要远低于个人对新网站的体验欲望。企业的需求是利益获取。在功能一致的情况下,为什么要选择没有聚集人气的新网站?
而且就像很多人无法摆脱QQ一样,已有交际圈的迁移问题不能解决。
与模块复制相比,更甚的是具体操作流程不根据自身网站受众群设计,只是看起来做了这么个“功能”的情况了。
暂无评论
流放之忆 发表于 七月 1st, 2008 | 分类:
生活记录
被无奈感包围了半年之后,终于决定离开。努力的想要做好主网站,却发现近乎成了一个人的战斗。改变不了环境,但是可以拒绝随波混日子。
半年来尝试琢磨团队缺失的东西,SEO,架构设定,以及用户体验等等,虽说到现在几乎成了别人吹嘘的工具——比如现在销售那边接单的时候跟客户大谈SEO,然后签下单子了按照客户要求做成很“炫”的Flash整站,让我“优化”,这很囧——不过,负责公司主网站的近一年,也学到了不少东西。
一直认为做前端需要有跟自己较真的执着。切图的时候困扰我的早已不是CSS,样式的书写只是一种技巧;倒是怎么书写XHTML结构会花费许多心思,相同的外观可以用不同的标签来实现,然而如何能把结构的清晰性、语义化以及程序员输出的效率平衡起来,需要的则是一种理念。
合同还有一个月到期,之后打算找一家网络公司,而不是个网站建设公司。目前的环境下,很多客户的需求还停留在要有个Flash,有滚动图片的阶段,做这样的网站没有被认同感。我的目标很明确,前端制作,为了代码的每一K字节,为了设计图的每一个像素的努力。
暂无评论