![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Web开发
陈秋歌
CSDN内容运营,关注前端开发、用户体验技术领域,希望携手更多技术专家,共同推进两大领域的向前发展。研发心得、项目实战、前沿技术……,只要是技术干货,十分欢迎您投稿至chenqg#csdn.net。人人都是主编,这里就是你的舞台。曾负责CSDN知识库产品内容运营,致力于为大家提供精华、专业的内容服务。
展开
-
细节决定成败——无CSS时网页的可读性
<br />先上示例,携程首页酒店模块的效果图如下:<br /><br />代码结构如下:<dl> <dt>酒店</dt> <dd>北京</dd> <dd>上海</dd> </dl> <ul> <li>北京酒店列表</li> <li>北京酒店列表</li> <li>上海酒店列表</li> <li>上海酒店列表</li> </ul> <br />这种结构在显示上没有任何问题,切换城市时下面的列表会相应改变。但当无法正常加载css时显示效果就比较杯具了,截图如下:<br /><br />接下去是转载 2010-09-16 12:30:00 · 417 阅读 · 0 评论 -
什么是响应式Web设计?怎样进行?
眼下,几乎每个新客户都希望他们的网站可以有专门的移动设备版本。最完美的情况呐,就是为iPhone、iPad、黑莓、Kindle...各自打造一款——页面分辨率还必须兼容任何设备。谁知道未来5年内我们还需要为多少新发明的设备设计开发不同版本的页面?这种疯狂什么时候算个头?在Web设计和开发领域,很快的,我们将会无法跟上设备与分辨率革新的步伐。对于多数网站来说,为每种新设备及分辨率创建其独立的转载 2015-01-14 15:03:40 · 1382 阅读 · 0 评论 -
网页布局中的常见的兼容性问题
1.居中问题 div里的内容,IE默认为居中,而FF默认为左对齐,可以尝试增加代码margin: 0 auto2.高度问题 两上下排列或嵌套的div,上面的div设置高度(height),如果div里的实际内容大于所设高度,在FF中会出现两个div重叠的现象;但在IE中,下面的div会自动给上面的div让出空间所以为避免出现层的重叠,高度一定要控制恰当,或者干脆不写转载 2015-01-14 15:47:26 · 1598 阅读 · 0 评论 -
通过CSS3 Media Query实现响应式Web设计
如今的屏幕分辨率,小至320px(iPhone),大到2560px甚至更高(大显示器),变化范围极大。除了使用传统的台式机,用户会越来越多的通过手机、上网本、iPad一类的平板设备来浏览页面。这种情况下,固定宽度的设计方案将会显得越发不合理。页面需要有更好的适应性,其布局结构要做到根据不同的设备及屏幕分辨率进行响应调整。接下来,我们将了解一下怎样通过HTML5和CSS3 Media Queries转载 2015-01-14 15:43:51 · 1370 阅读 · 1 评论 -
30段超实用CSS代码
上周,研发频道发表了一篇“ Web开发者不容错过的20段CSS代码”,大家一致觉得很实用。该文是笔者对后30个的翻译,希望对大家有帮助。1.花式连字符(&)这个类应该在span元素里使用,并且里面包括&字符。它使用经典的serif字体和斜体来增强&符号。.amp { font-family: Baskerville, 'Goudy Old Style', Palat转载 2013-07-08 15:34:58 · 3767 阅读 · 2 评论 -
十个jQuery图片画廊插件推荐
jQuery的画廊插件可以将分组图像和多媒体资料转成类似Flash的图像或照片。当幻灯片已经成为网站的重要组成部分,jQuery的重要性不能被忽视。下面为你介绍了10个最有美感,创新性和创造性的jQuery图片画廊插件:1.How to Create a Simple Slideshow using Mootools / JQuery当我们想要在有限的屏幕空间展示很多内容,这要使用到幻灯片。幻灯片是最佳的可以展现大量的信息的方式。在这篇文章中我将展示使用MooTools / Jquery做出简单的幻转载 2011-01-04 11:50:00 · 540 阅读 · 0 评论 -
分享国外优秀JQueryPlugin–Booklet
<br />Booklet是一个可以让你网页上的内容已一本连环册一样的样式展示出来的JQuery工具.它基于JQuery库.Codrops写了一个教程,以指导我们如何初始化和使用这个工具.来创建一个JQuery的Moleskine notebook<br /><br />要求:jQuery Framework<br />Demo: http://tympanus.net/Tutorials/MoleskineNotebook/转载 2011-01-04 10:56:00 · 669 阅读 · 0 评论 -
Web开发与设计语言大盘点
<br />在这个 Web 的时代,与 Web 相关的开发技术持续热门,从前端到后端,从标记语言到开发语言,各种技术交相辉映,沉沉浮浮,作为开发者,尤其是初级开发者,如何选择几门适合自己的开发语言尤为重要。本文是对所有 Web 相关开发语言的一次盘点,并指出其中最有前途的开发与设计语言。无穷尽的选择<br /><br />在 Web 开发与设计领域,我们有太多的选择,HTML 还是 XHTML, RSS 还是 Atom, PHP 还是 ASP.NET, SVG 还是 VML, JavaScript 还是 V转载 2010-11-29 15:45:00 · 523 阅读 · 0 评论 -
网站开发人员应该知道的62件事
近日,有人在Stack Overflow上发表提问“动手开发网站之前,需要知道哪些事情?”,众多人给出了不同的答案,同时所有人根据Stack Overflow问题下面的wiki区对众多答案进行了编辑,总结出62条网站开发人员应该知道的事。Web技术开发者阮一峰把这62条答案进行了翻译,现转载于此,全文如下:有人在Stack Overflow上发问,动手开发网站之前,需要知道哪些事情?不出意料地,他得到了一大堆回答。通常情况下,你需要把所有人的发言从头到尾读一遍。但是,Stack Overflow转载 2010-11-29 17:28:00 · 431 阅读 · 0 评论 -
20个学习CSS的绝佳网站——让你从入门到精通
<br />CSS(层叠样式表)是一种简单的设计语言,能够将页面变漂亮这回事儿变的简单化。在HTML和XHTML中设定页面的样式,这是最常用的应用。但也可以应用于 XML类的文档,包括SVG和XUL。他负责管理网页的设计和外观。使用CSS,你可以控制文字的颜色、字体、段落间距、分栏的数目大小布局、背景图片颜色,以及其他很多种的效果。接下来才是要说的是学习并掌握CSS的20个绝佳站点。这里收集到的CSS站点能使你从初学者到高级人员。这些能协助你开发和改进网站。恩,随便看看吧。<br />Csstutorial转载 2010-09-30 15:15:00 · 1346 阅读 · 0 评论 -
你需要了解的21个CSS惊人技巧
<br />级联样式表(CSS)在当代Web设计中已经成为重要的环节,如果没有CSS现在的网站将像10年前一样不堪入目。随着CSS技术的普及,越来越多的高质量CSS教程涌入互联网,让我们的学习更加方便。下面彬Go向大家推荐21个惊人的CSS技巧,相信其中必有你想不到的。还等什么,继续往下看吧!1.CSS跨浏览器幻灯片<br /><br />点击上图查看清晰原图<br />演示了如何仅适用CSS打造一个跨浏览器的图片画廊2.基于CSS的图片地图<br /><br />这个教程演示了如何使用纯CSS创建一个”疯转载 2010-09-26 11:38:00 · 471 阅读 · 0 评论 -
实用HTML,CSS和JavaScript速查表
<br />Vikas曾发表过一篇博文《Most Useful Cheat Sheet For HTML, CSS and Javascript》,为我们总结了一些实用的HTML,CSS和JavaScript速查表,并把链接附上了。外刊IT评论对本文进行了翻译,现转载于此,供大家学习。全文如下:<br />速查表是帮你记住东西的有效工具。Web设计师和开发者经常使用的快捷键简表会使他们在网上的工作效率大大提高。<br />事实上,速查表就是来帮助我们把日常中最常用到的信息聚集起来,方便使用,使我们做工作时更转载 2010-09-21 13:52:00 · 454 阅读 · 0 评论 -
实用HTML,CSS和JavaScript速查表
Vikas曾发表过一篇博文《Most Useful Cheat Sheet For HTML, CSS and Javascript》,为我们总结了一些实用的HTML,CSS和JavaScript速查表,并把链接附上了。速查表是帮你记住东西的有效工具。Web设计师和开发者经常使用的快捷键简表会使他们在网上的工作效率大大提高。事实上,速查表就是来帮助我们把日常中最常用到的信息聚集起来,方便使用,使我们做工作时更有效率。有了它们,免去了你的大脑花额外时间去记忆它们的烦恼——你只需要打开简表,马上能查到你想要的信转载 2010-09-26 10:09:00 · 762 阅读 · 0 评论 -
设计人员要引以为戒的9个设计糟糕的网站
<br />Web网站设计对某些人来说可能很容易,但是对一个新手来说,这可能是一件很艰苦的事。在网上,我们总会碰到很多在界面设计、颜色搭配和整体内容安排上十分糟糕的网站。 <br />今天我们收集了一些在设计上非常糟糕的网站,在网上冲浪时可避免他们。这些网站有的在颜色设计方案上很糟糕,有的采用了很恐怖的排版样式。 <br />不再在批评上浪费时间了,让我们一起去看看这些网站在设计上的败笔究竟是什么?<br />下面这个绚丽的“庞然大物”仅仅是一个网站的访问入口。 <br /><br />另一个网站,只有你访翻译 2010-09-26 10:02:00 · 1330 阅读 · 0 评论 -
overflow :hidden详细解释
overflow:hidden这个CSS样式是大家常用到的CSS样式,但是大多数人对这个样式的理解仅仅局限于隐藏溢出,而对于清除浮动这个含义不是很了解。一提到清除浮动,我们就会想到另外一个CSS样式:clear:both,我相信对于这个属性的理解大家都不成问题的。但是对于“浮动”这个词到底包含什么样的含义呢?我们下面来详细的阐述一下。这是一个常用的div写法,下面我们来书写样式。大家可以在DMX中自己做试验#box{ width:500px; background:#00转载 2010-09-21 15:56:00 · 2343 阅读 · 0 评论