分类: 前端技术&设计教程 |
预览模式: 普通 | 列表

图片压缩优化能有效提高网站浏览速度

1、产品概念文档(项目策划书)

主要是对市场需求进行合理的科学的推导,得出新产品机遇,并对产品定位以及未来的发展方向进行概念性阐述。产品概念文档主要用来对新产品进行宣讲,让项目团队对将要开发的产品有一个概念上的理解,在思想上达成一致。

2、用户调研报告

查看更多...

Tags: 产品开发 项目策划书 交互设计文档 交互设计规范 开发文档

用border实现图片的一个边框比较常见的,实现加双边框并且有间距有背景,鼠标经过背景变色,这个就有点不一样了,看看下面的例子吧:
HTML代码


[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]

查看更多...

Tags: 双边框 CSS 背景变色 鼠标经过变色 CSS图片双边框

水平居中和垂直居中的多种CSS实现方法

在定义网页的CSS样式的时候,我们或许并不怎么用到垂直居中。在和别人合作的时候,自己的代码自适应性就需要做到最大程度的好。你自己在做自己的网页的时候或许可以保证在视觉上是居中的,但是如果让这个元素或者他的父元素变大了,你还能保证居中吗?

vertical-align是个不错的属性,但是这个属性起初是针对表格的cell的。当然这个属性虽然对块级元素不起作用,但是对行内元素比如span还是有作用的(这时候,这个属性设置为负值元素内容就下移,正值则上移)。

下面是比较专业的垂直居中的集中解决方案。记录于此,以便查阅。

查看更多...

Tags: 垂直居中 水平居中 CSS居中 div居中 margin水平居中 单行居中

DIV清除浮动新说

起源:
程序代码 程序代码

.clearfix:after {
visibility: hidden;
display: block;

查看更多...

Tags: 清除浮动 DIV IE兼容 DIV浮动 浏览器浮动

网页背景设计制作六大技巧攻略介绍

1.颜色背景  

  颜色背景的设计是最为简单的,但同时也是最为常用和最为重要的,因为相对于图片背景来说,它有无与伦比的显示速度上的优势。在网页文件中,一般通过<body>标签来指定页面的颜色背景,其HTML语法为:  

  <body bgcolor="color">  

查看更多...

Tags: 网页背景网页制作技巧网页背景cssbackground

品牌标识(logo)设计的12条规则

logo是品牌的"面子"--第一印象,所以极其重要。一个设计优秀的logo是品牌的重要资产。 然而,仅仅靠优秀的平面设计并不能保证设计出来的logo是令人印象深刻且形象生动的品牌标识。 正如不同的行业有其特定的技能,logo设计也要求设计师不断学习,积累经验才能获得成功;对所有平面设计师来说,知识便是能力。
以下总结出要设计好的logo必须遵循的12条规则以供参考:
1. 初期工作不可少

初期草图是设计logo的重要开始步骤。你可以简单的用铅笔在纸上手绘,或者用Illustrator软件中的矢量工具绘出草稿。一旦你跳过或者草草结束这一步骤,就会影响最后的设计结果。  

查看更多...

Tags: 品牌标识LOGO设计设计规则品牌logo设计风格

网页中CSS Sprites图片整合技术的使用

在css中用一张背景图做页面的技术有什么优势呢。这个就是CSS Sprites使用优势
简单介绍一下 CSS Sprites 的优点:
1)、当用户往U盘中拷200张图片,会等很久。但是如果弄成一个文件,再拷贝就会快很多。
2)、CSS Sprites 的目的就是通过整合图片,减少对服务器的请求数量,从而加快页面加载速度。

查看更多...

Tags: CSS Sprites图片整合技术CSS图片整合CSS背景定位

使用CSS制作Web页面的十五条基本常识

使用DIV+CSS做网页排版不是换个标签然后再去按照表格的方式去排版,而是需要做到网页制作的内容与表现的分离。
1: ID用于标识页面单独元素以及持久行的结构性元素 方便JS的调用,类用于标识同一页面可重复定义使用的结构性元素 ID与类的命名需与表现形式无关 :leftContent 而使用有意义的定义方式:sideBar等等。命名方式遵循“驼峰式大小写(标志符由多个单词组成 除首词首字母小写外 其余单词首字母均大写)”

2:避免滥用类 当类型的结构需要不一样的表现时 记得什么是层叠样式表 具体结构中的p a h1等可使用如下方式:div.sideBar p{}定义即后代选择器+ID或类选择器组合方式。

查看更多...

Tags: DIV+CSSCSS制作页面CSS常识CSS盒模型

PS里怎么做硬币质感的表现方法介绍

硬币质感在很多地方多可以看到,常常玩游戏就知道,游戏上面就有很多这样的效果出现,不管是网页还是LOGO,还是游戏的界面上,平时留意就可以发现很多简单的效果被运用的很好很合理~~~~~

质感表现之硬币质感——先看看最后的效果图————如下图:

查看更多...

Tags: 硬币质感PS质感质感的表现PS教程质感制作

小站设计欣赏 设计关键字:VI 广告 UI 界面 Web 酷站 雨风设计 标志 画册 教程
国外极具创意的广告作品
国外极具创意广告
Aucma fridge 平面广告设计欣赏
Aucma fridge 平面广告"
新款三星YP-P3全新用户界面欣赏
三星YP-P3新用户界面
百事可乐新标的趣味设计——喝百事可乐更令人发胖
百事可乐新标趣味设计
比利时Maxime Quoilin平面设计
比利时Maxime Quoilin
日本设计師佐藤卓作品欣赏(一)
日本佐藤卓作品
企业视觉识别系统设计规范——“企业CI专题知识”