web前端
文章平均质量分 64
lixinstudio
我不是最好的,但我们是最棒的
展开
-
网页美感来源于形式和内容统一
现在视觉专家表明:用户浏览网站是按照“F”型的视觉路线。我们看任何东西都是从上往下的,最顶部左上角的位置是最明显的,也是最先被看到,这一点已经被现在所有的网站都运用上了,大家通常把公司的LOGO,网站的名称放在这个位置。接下来看到的是中间区域左边的一部分,这个区域大多数电商站喜于放产品栏目,以便用户查找。最后就是底部内容部分的。了解了这个规律,当我们在设计页面的时候就知道怎么样做内容,怎么样让内容原创 2011-11-18 00:42:19 · 2127 阅读 · 1 评论 -
第五步:网页主要框架之外的附加结构的布局与表现
除网页主要框架之外的附加结构的表现(Layout),包括以下内容: 1.主导航条; 2.标题(heading),包括网站名和内容标题; 3.内容; 4.页脚信息,包括版权,认证,副导航条(可选)。 加入这些结构时,为了不破坏原有框架,我们需要在css文件"body"标签(TAG)下加入: Example Source Code.hidden {翻译 2011-11-24 15:34:00 · 1173 阅读 · 0 评论 -
我学习css看的第一篇文章 (强烈推荐,适合新手学习)
点击链接查看教程具体内容!第一步:规划网站http://blog.csdn.net/lixinstudio/article/details/7008355第二步:创建html模板及文件目录等http://blog.csdn.net/lixinstudio/article/details/7008350第三步:将网站分为五个div 网页基本布局http://blo翻译 2011-11-24 15:45:08 · 1177 阅读 · 1 评论 -
JavaScript 开发进阶:理解 JavaScript 作用域和作用域链
作用域是JavaScript最重要的概念之一,想要学好JavaScript就需要理解JavaScript作用域和作用域链的工作原理。今天这篇文章对JavaScript作用域和作用域链作简单的介绍,希望能帮助大家更好的学习JavaScript。 JavaScript作用域 任何程序设计语言都有作用域的概念,简单的说,作用域就是变量与函数的可访问范围,即作用域控制着变量与函数的可见性和生命周翻译 2011-11-25 12:01:42 · 1068 阅读 · 0 评论 -
JavaScript初学者应注意的七个细节
每种语言都有它特别的地方,对于JavaScript来说,使用var就可以声明任意类型的变量,这门脚本语言看起来很简单,然而想要写出优雅的代码却是需要不断积累经验的。本文利列举了JavaScript初学者应该注意的七个细节,与大家分享。(1)简化代码 JavaScript定义对象和数组非常简单,我们想要创建一个对象,一般是这样写的: 1var原创 2011-11-25 20:14:15 · 946 阅读 · 0 评论 -
DivCSS+JavaScript实现 始终居中的半透明弹出层
DivCSS+JavaScript实现弹出一个始终居中的半透明层,它可以自动适应浏览器窗口大小,拖动IE滚动条它仍然居中,而且还可以改变它的透明度,和大站的效果是一样的。 先看HTML代码: Example Source Code[www.52css.com]52CSS.com欢迎你!Q群号:48822948关闭窗口点击这里弹出层 再编写CSS翻译 2011-12-01 12:37:54 · 834 阅读 · 0 评论 -
开发备必:WEB前端开发规范文档
规范目的 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必 须按本文档规范进行前台页面开发. 本文档如有不对或者不合适的地方请及时提出, 经讨论决定后方可更改.基本准则 符合web标准, 语义化html, 结构表现行为分离, 兼容性优良. 页面性能方面, 代码要求简洁明了有序, 尽可能的减小翻译 2011-12-01 12:36:11 · 1358 阅读 · 0 评论 -
divcss布局及Web标准对网站优化和SEO方面的益处
现在采用CSS+DIV建网站的朋友越来越多,我们今天就谈谈divcss布局及Web标准对网站优化和SEO方面的益处: 一、用css+div,就要放弃以前表格排版的一些习惯,包括页面格式的一些习惯:1.以前用表格排版,一般都是用不规则的背景图片,跨单元格来做一些不规则的效果.css+div的特点就是格式和样式分开.2.css+div还是用块的行使排版比较好,页面简单,直观,不那么花哨.源码翻译 2011-12-01 12:31:07 · 1018 阅读 · 0 评论 -
另类视觉艺术———抽象艺术
进入二十世纪以来,抽象艺术的界定,已不再只是用来做为写实风格的对立面。具象、抽象及叙述性的内容,已在西方抽象表现的发展中,获得了认定。复合媒材的使用,更打开了形式表达的局限,彰显其丰富的语汇。继康丁斯基、蒙德里安视觉美学探索的架构之后,对于视觉艺术,「抽象」一词的意涵,艺术家仍在美术史的演绎中,将意涵推展至社会学, 艺术史等各个层面,使抽象意题呈现的可能性,更为宽广。「学习」与「经验」,使翻译 2011-12-01 21:22:04 · 1336 阅读 · 0 评论 -
迅速提高设计水平的9大秘诀 [
要提高设计水平,前提当然是必须掌握基本的软件技术和了解专业的理论知识等。以下是迅速提高设计水平的九大秘诀。一,想设计师首先必须善于思考,对设计主张自己的想法和理解,这是最重要的。别担心你的想法有多“烂”,没有人能一下子做好的,但你完全可以做好你的习惯和态度。学会大胆地摸索和尝试自己的想法,懂得借鉴,追求属于自己的创意。但是如果在设计时不动脑筋地套模板,套素材,甚至是盲目模仿和抄翻译 2011-12-01 21:23:32 · 1226 阅读 · 0 评论 -
高品质的网页设计: 实例与技巧之三(文字排列与字体选用的诀窍)
尽管设计师大都不会亲自撰写网站的实际内容,不过他们对于内容的整体品质仍然至关重要。设计师的作用就是要保证内容的展现方式足够易读。有很多方法能保证你的字体易读易用,不过我不会给大家列一些该做什么或者不能做什么的规矩和条款,我带给大家的是一些聪明运用字体的实例和分析。仔细考虑了字体的实例The Netsetter上大而漂亮的字体网页设计中,标题很重要,对于博客设计来说尤为如此。最近流行翻译 2011-12-02 10:46:52 · 1788 阅读 · 2 评论 -
高品质的网页设计: 实例与技巧系列之一(留白)
提升网页和博客设计品质的一些实例和技巧“高品质”是所有人追求的目标,在网页设计的世界中也不例外。不过何为“品质”,如何判断一项设计的品质是好还是坏?笔者恰好有一套找出网页设计中品质焦点的方法。一旦你了解到如何判断一项高品质的设计究竟好在哪里,你就掌握了让自己的设计更趋完美的大量技巧。接下来我会给大家列一些要点,并附上相应的例子,与大家分享一下我在别人的网页设计中寻找“高品质”的过程。翻译 2011-12-02 10:42:56 · 2271 阅读 · 2 评论 -
高品质的网页设计: 实例与技巧之二(像素级的完美)
有一个方法能够看出某人在完成一项网页设计时是否真的用心了。有时候创造奇迹的就是一些小细节,一些别人几乎无法察觉的细节。我所说的“像素级的完 美”就是指在线条、边缘和边框描边上仔细推敲。与其就用一条单一的线,不如多加一些细节。细节可以是细微的渐变,也完全可以只是一条1像素宽的细线(用作表现阴影或高光)。有了这些细节, 你的设计会大不一样。有些设计师在这方面特擅长: Collis Ta’eed, Da翻译 2011-12-02 10:45:43 · 1876 阅读 · 2 评论 -
高品质的网页设计与技巧之四(元素的组织)
设计师这一职业对很多人都有吸引力,因为那些制造创意的过程,实在是十分有趣。我知道组织内容的过程就没有那么有趣了,不过一旦你养成了组织内容的好习惯,你就会发现其实它也没有想象中那么枯燥。组织内容的方式总是需要看情况而定,比如说,这站点是什么类型?某项特定内容在页面上的重要性如何?如何放置内容,以及放到哪里,可能的排列组合实在太多了。不过还是有一些技巧可循的。最基础的就是,先决定你的设计需要达翻译 2011-12-04 10:35:50 · 678 阅读 · 0 评论 -
高品质的网页设计: 实例与技巧之七(做别人没做过的事 )
最好的网站中有一些非同寻常的,奇怪的,甚至可以算得上诡异的设计。不过那些挑战传统的尝试说不定会已经改变了传统的定义。话说回来,要做到完全原创,创造出没人做过的东西实在是设计过程中最难做的事。打破常规之后,成功与失败只有一步之遥。你要么做出令人惊艳的聪明设计,要么做出一堆垃圾饱受批评。别人从来不这么做是有原因的,因为有些点子实在是糟透了。要从人们知道并喜欢的区域走出来,你得非常勇敢才行。下面翻译 2011-12-05 13:03:02 · 912 阅读 · 0 评论 -
高品质的网页设计与技巧之五(自我克制与精妙细节)
设计师总是在寻找制造冲击力的方式,总是想做一个独一无二的设计,创造些前所未有的效果。不过有时候通过自我克制也能形成冲击力。量变产生质变,过多的“好”也会带出不好的结果。好的设计师晓得平衡点在哪里,并且能避免让过多的特殊效果毁了一项设计。“Things”网站上的柔和渐变对于我访问过的站点,我总是很关注他们的细微渐变。听起来可能有点恼火,不过我就是忍不住要去研究别人的那些小细节,以积累我将翻译 2011-12-04 10:37:34 · 1278 阅读 · 1 评论 -
第六步:页面内的基本文本的样式(css)设置
你是不是厌倦了那些大红大绿的背景,现在是去掉它们的时候了,只保留导航条的红色背景。真是难为您居然能坚持学习本教程到此,很好,再过几步,你就能很好了解css控制整个网页版面(Layout)的能力。 先设置全局的文本样式: Example Source Codebody {font-family: Arial, Helvetica, Verdana, Sans-serif翻译 2011-11-24 15:33:30 · 1213 阅读 · 0 评论 -
第一步:规划网站,本教程将以图示为例构建网站
首先需要规划网站,本教程将以下图为例构建网站。 其基本布局见下图:主要由五个部分构成: Example Source Code[www.52css.com]1.Main Navigation 导航条,具有按钮特效。 Width: 760px Height: 50px 2.Header 网站头部图标,包含网站的logo和站名。 Width翻译 2011-11-24 15:37:30 · 1440 阅读 · 0 评论 -
分享经验,做一个好用的扩展性好的网站管理系统
我个人作网站后台系统的开发已经有十多年了,做的东西自认为还不错,至少自己是非常用心的在作这个系统,是真心做做好这个系统,而不是靠胡说八道,蒙骗不懂的客户,我希望每一个用我系统的人,越用越能领悟我做这套系统的深意,越用越觉得这套系统作得好。 我的目标是:自己的系统是精致的,好用的、灵动的,他要有超级多的功能,还要非常简单易用;他要超强的扩展性,还要能抵挡黑客的进攻,他要有精致漂亮的界面,但不原创 2011-11-13 23:46:01 · 1435 阅读 · 6 评论 -
不同css等级的人对css的看法
关于CSS,如果有人问起你关于CSS方面的话题,对于CSS熟悉度不同的人分别有如下精采的回答,非常有趣:第0级:CSS?那不是一个多人射击游戏吗?有些人因为在找CS:S(Counter Strike: Source)这款游戏的资讯而进到#CSS网站。不必担心这些人,他们不可能制作太多网页,所以对网络也不会造成多大伤害。Yeah, I use it to remove underline翻译 2011-11-05 14:44:40 · 855 阅读 · 0 评论 -
对于中国移动wap2.0业务开发的建议
1)必须是XHTML格式页面,不能是WML页面 这是WAP 2.0与WAP 1.X的根本区别之一。2)必须限定页面大小,建议为5K~10K 虽然WAP 2.0协议栈的传输效率要高于WAP 1.X,但为了限制页面下载时间,提高业务可用性,保持良好的用户感受,必须对页面大小进行限定。3)必须是彩色页面,使用图文混排功能 图文混排能极大的提高用户原创 2011-11-18 00:26:28 · 1324 阅读 · 0 评论 -
25款精美的后台模板 附演示及打包下载
25个精美后台模板,基本都来自经典设计,部分带有登陆页、以及psd文件,满足广大网友设计后台的需求!压缩包内容包括所有25个精美后台模板,如果仅需要个别模板,请下载压缩包,并根据相应的文件夹编号查找。全部演示如下: http://www.okajax.com/demo/admin_templates/1/http://www.okajax.com/demo/ad原创 2011-11-14 13:20:01 · 2814 阅读 · 2 评论 -
css命名规范
头:header 内容:content/containe 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中:left right center 登录条:loginbar 标志:logo 广告:banner 页面主体:main 热点原创 2011-11-14 00:18:42 · 918 阅读 · 0 评论 -
本人多年经验总结关于网页制作的十大禁忌
请同行补充指教01. 无法连接:我们常看到网页链结错误或失败的现象,大多归咎于上传前未事先检查或测试 ,部份是因为被链结的网址已变更或消失,您未察觉;所以良好的网站必须经常仔细查对与维护。 02.网页过大:虽然现在频宽已大幅提升,但是大多数的网友都还停留在64k拨接阶段,除非您 的内容必要,否则建议将每页容量控制在30kb左右,长度在2页面以内;如需借用外部链结资源,如採用绝对 链原创 2011-11-18 00:17:34 · 1959 阅读 · 1 评论 -
关于css网页设计的顶级图书——《css禅意花园》
本书作者是世界著名的网站设计师,书中的范例来自网站设计领域最著名的网站——CSS Zen Garden(CSS禅意花园)。全书分为两个主要部分。第1章为第一部分,讨论网站“CSS禅意花同”及其最基本的主题,包含正确的标记结构和灵活性规 划等。第二部分包括6章,占据了本书的大部分篇幅。 每章剖析“CSS禅意花园”收录的6件设计作品,这些作品围绕一个主要的设计概念展开,如文字 的原创 2011-11-13 23:35:47 · 3088 阅读 · 0 评论 -
一些关于网页设计的优秀网站
1、The Best DesignsThe Best Designs是一个现成查看高质量XHTML和Flash设计的优秀网站,该网站标记与每一个设计的关键字(例如用加粗、加色、或者是用更深的CSS),让读者更容易得到自己想搜索的东西。2、CSS RemixCSS Remix是一个(据他们自己的简介)Web 2.0网站最佳设计的弄潮儿。当然了,该网站也包括一些非Web 2.0的主翻译 2011-11-05 14:50:04 · 1845 阅读 · 0 评论 -
7个网上最优秀的CSS资源
无论你用Wordpress还是Z-blog还是其他的博客后台,只要你在做网站,CSS(什么是CSS?)你不得不面对,如何令你的网站风格漂亮,当靠别人是不够的。如何你想学CSS但不知道在哪学,那么很好,今天向大家推荐7个网上最优秀的CSS资源。1、CSS2 Specification 这是CSS的官方指南,当然你在上面看东西可能会觉得很枯燥,不过不要紧,CSS它说了算,所以真的有心学好,这会是一原创 2011-11-05 14:46:23 · 920 阅读 · 0 评论 -
第十步:解决IE浏览器的显示BUG
要继续此教程需要IE的以前的版本进行测试,绝大部分用户使用的是IE6.0,因此您几乎不需要看下去了。IE中主要出问题的是IE5和IE5.5,如其不能识别css中margin值为auto,要实现层的中间对齐,需加入: Example Source Code[www.52css.com]body {font-family: Arial, Helvetica, Verdana,翻译 2011-11-24 15:30:15 · 1099 阅读 · 0 评论 -
第九步:导航条的制作
导航条之所以放在第九步讲,是因为导航条制作是本教程中最难的部分,自然也是技术含量最高的地方.导航条的制作可易可难,但这里介绍的相对较难,您能坚持到这一步已经很不易,如果你只是有个导航条就满足的话,请参看第八步的副导航条的制作。 先去掉导航条的红色背景,还有就是移除html文件中main-nav层的"class="hidden"",使导航条的内容显示出来。我们实现导航条图片的变换的方法是纯cs翻译 2011-11-24 15:31:07 · 1600 阅读 · 0 评论 -
第八步:页脚信息的表现设置
首先需要控制页脚的文本显示: Example Source Code[www.52css.com]#footer {clear: both;height: 66px;font-family: Tahoma, Arial, Helvetica, Sans-serif;font-size: 10px;color: #c9c9c9;} 接着我们需翻译 2011-11-24 15:31:44 · 1352 阅读 · 0 评论 -
第七步:网站头部图标与logo部分的设计
为实现设计时的网页头部效果,我们需要以下两幅图:(点击另存,并相应修改文件名) /images/headers/about.jpg /images/general/logo_enlighten.gif 首先我们给#header层添加背景图案: Example Source Code[www.52css.com]#header {height翻译 2011-11-24 15:32:23 · 2405 阅读 · 0 评论 -
第四步:网页布局与div浮动等
1.浮动:首先让边框浮动到主要内容的右边。用css控制浮动。 Example Source Code[www.52css.com]#sidebar-a {float: right;width: 280px;background: darkgreen;} 表现如下:2.往主要内容的盒子中写入一些文字。在html文件中写入:翻译 2011-11-24 15:34:36 · 1239 阅读 · 0 评论 -
第三步:将网站分为五个div,网页基本布局的基础:
1.将“第一步”提到的五个部分都放入盒子中,在html文件中写入: Example Source Code[www.52css.com]Main Nav Header Sidebar A Content Footer2.为了将五个部分区分开来,我们将这五个部分用不同的背景颜色标示出来,在css文件写入: Example Sou翻译 2011-11-24 15:35:24 · 2583 阅读 · 0 评论 -
第二步:创建html模板及文件目录等
1.创建html模板。 代码如下: Example Source Code"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">CompanyName - PageName @import "css/master.css";翻译 2011-11-24 15:36:45 · 3094 阅读 · 0 评论 -
高品质的网页设计: 实例与技巧之六(发挥色彩的全部潜能 )
设计师一般喜欢按照自己的品味来选择颜色,这可实在太不专业了。要决定哪种颜色是最适用的,你的脑子里想的应该一直是品牌需求,然后选好色彩的搭配组合,指定其专属的主题和目标情绪。网页设计中色彩运用的绝妙例子无趣并不代表无色:OyproOypro的网站让我喜欢的地方是,他们告诉了我们,一项“无聊”的行业相应的设计并不一定也得“无聊”。通常企业的网站都不允许设计师有太多视觉创意上的发挥。保持翻译 2011-12-05 12:59:41 · 809 阅读 · 0 评论