1 8, 2007
作者: xw | 分类: Web 标准
css在页面里面一般有三种引入方式
1.在页面里面直接写
- <style type="text/css">
- body{
- margin: 0;
- padding: 0;
- }
- </style>
2.用link进行引用
- <link rel="stylesheet" type="text/css" href="my.css">
3.用import进行引用
- <style type="text/css">
- @import url(my.css);
- </style>
第一种是直接在html页面上进行css书写,而第二种和第三种是采用外部引用样式单独提取文件。
问题1.到底link和@import有什么区别?
我们先来看看他们的定义
(more…)
1 7, 2007
作者: xw | 分类: Web 标准, 工作
UX Magazine.com是2006年度首届css大赛的冠军网站,呵呵既然是冠军网站肯定有他自己的特点
和得到冠军的法宝,其中一个就是采用了宽平和窄屏的两种不同显示模式,在屏幕>1024的时候采用
三列,当屏幕<1024的时候采用两列,而且设计的巧妙在于如果你不仔细观察根本发现不了它细节
上的变化,可以说利用了巧妙的css技巧让,让宽平和窄屏幕的用户都可以很好的浏览网站内容。
那么下面我们就来分析分析他是怎么做的,先来看看首页的源代码。(非常的整洁和干净)
先看头部找到关键部分:
- ............
- <link rel="stylesheet" href="http://www.uxmag.com/_css/uxm.base.css" type="text/css" media="screen" />
- <link rel="stylesheet" href="http://www.uxmag.com/_css/uxm.1024.css" type="text/css" media="screen" id="wide" title="wide" />
- <link rel="alternate stylesheet" href="http://www.uxmag.com/_css/uxm.800.css" type="text/css" media="screen" id="narrow" title="narrow" />
- <link rel="stylesheet" href="http://www.uxmag.com/_css/uxm.print.css" type="text/css" media="print" />
- ................
- <!-- h5 & h6 Image Replacement Script -->
- <script src="http://www.uxmag.com/_js/imageReplace.js" type="text/javascript"></script>
- <!-- Generic Scripts / Functions -->
- <script src="http://www.uxmag.com/_js/jsLib.js" type="text/javascript"></script>
- ......................
- <!-- Various functions that initialize the page. -->
- <script type="text/javascript">
- <!--
- function doOnResize () {
- determineStyle();
- }
- function doOnLoad () {
- determineStyle();
- if ( getCookie("externalLinks") ) {
- setLinkAttributes( getCookie("externalLinks") );
- }
- }
- window.onresize = doOnResize;
- window.onload = doOnLoad;
-
- //-->
- </script>
- .......................
从上面的代码可以看出,整个页面引用了四个主要css:
1.uxm.base.css是整个页面的基础样式;
(more…)
1 3, 2007
作者: xw | 分类: Web 标准
呵呵为什么又来一个破解,为什么是淘宝菜单,因为taobao上面的菜单,可以说是中国第一个大型网站采用css做的滑动门菜单,二来
滑动门有一弱点就是会产生选中链接的虚线线框偏移,而淘宝的菜单是没有虚线框的,哈哈至于怎么做到的我们会在下面分析:
好了长话段说我们先打开taobao的首页看看找到如下代码:
- <ul id="ChannelMenuItems">
- <li id="MenuHome"><a href="http://www.taobao.com/index.php?from=top" target="_top"><span>首页</span></a></li>
- <li id="MenuDigital"><a href="http://www.taobao.com/vertical/digital/index.php?from=top" target="_top"><span>数码通讯</span></a></li>
- <li id="MenuLady"><a href="http://www.taobao.com/vertical/lady/index.php?from=top" target="_top"><span>女人</span></a></li>
- <li id="MenuLife"><a href="http://www.taobao.com/vertical/life/index.php?from=top" target="_top"><span>家居</span></a></li>
- <li id="MenuPet"><a href="http://www.taobao.com/vertical/pet/index.php?from=top" target="_top"><span>宠物</span></a></li>
- <li id="MenuMan"><a href="http://www.taobao.com/vertical/man/index.php?from=top" target="_top"><span>男人</span></a></li>
- <li id="MenuSports"><a href="http://www.taobao.com/vertical/sports/index.php?from=top" target="_top"><span>运动</span></a></li>
- <li id="MenuGame"><a href="http://www.taobao.com/vertical/game/index.php?from=top" target="_top"><span>游戏</span></a></li>
- <li id="MenuCulture"><a href="http://www.taobao.com/vertical/culture/index.php?from=top" target="_top"><span>书籍音像</span></a></li>
- <li id="MenuHongkong"><a href="http://www.taobao.com/vertical/hkstreet/index.php?from=top" target="_top"><span>香港街</span></a></li>
- <li id="MenuMall"><a href="http://www.taobao.com/vertical/mall/index.php?from=top" target="_top"><span>淘宝商城</span></a></li>
- </ul>
很标准的滑动门菜单结构,至于真正的滑动门菜单技术我们这里不详细介绍,如果你不是很了解的话,可以去看《CSS中的滑动门技术》,我们在查找一下菜单的css
(more…)
1 3, 2007
作者: xw | 分类: 软件应用
Internet Explorer 7 和windows media player11 出来以后,因为加强了正版验证所以必须在正版的xp下
进行安装,也不知道微软怎么想的,又想普及ie7又弄个验证让你一般人安装不了,中国应该来说几乎
是没有正版的。要想安装必须通过破解跳过WGA验证,网上也有几种破解的安装方式,但是过程都十分繁琐,下面我来介绍一下一种简单的安装方式。
1.用windows update升级安装最新的正版验证补丁,安装以后验证你不是正版的,这个无所谓了
只要确认安装了最新的正版验证不定就好了。
2.用记事本打开C:\Documents and Settings\All Users\Application Data\Windows Genuine Advantage\data 目录下的data.dat文件,把里面的所有内容全部删除,然后保存。
3.把网线断掉。
4.开始安装ie7或wmp11吧…..
相关下载:
Internet Explorer 7 简体中文正式版
windows media player 11 简体中文正式版
1 3, 2007
作者: xw | 分类: 用户体验&交互设计
今天继续再看让我非常难读的,之所以认为难读是因为里面很多话都是经典的,经典的话太多就需要记忆和揣摩,所以耗费的脑细胞就比较多,所以就很耗费时间所以就难读,哈哈
今天读到目标这里,书上说目标总体分为‘用户目标’和‘非用户目标’,其中非用户目标分为,生活目标,体验目标,和最终目标;而非用户目标分为,顾客目标,公司目标和技术目标。当我仔细读完以后突然间想到了两样东西,一个是Gmail还有一个就是脑白金。两种行业的两种不同的产品,但是从本质上可以看出,Gmail就是一个‘用户目标’产品而‘脑白金’就是一个非用户目标产品,Gmail就是一个很实用的东西并不漂亮也不华丽但是很好用,仿佛在email领域这么多年以来打破了一个僵局,而‘脑白金’是一个看上去很华丽,送给老人的极好首选产品,但是买的人几乎从来不用,至于具体功效反正不害人就是了,同样也是中国保健品的一个典范。那web2.0产品到底应该是那种产品呢,答案很明显就是‘用户目标’产品,因为大多数的web2.0更像是工具,是自己用的,大多数用户不会关心你的界面是否漂亮,至于送人更不太现实,用户关心的是是否好用,
(more…)