gkvalley的博客_CSS

如何让2个并列的div根据内容自动保持同等高度

有左右2个并列的div，2个div都不能限定高度。左div为导航，右div为内容。如何能让左div块自动获得和右div块相等的高度？同时，也有网友提问到“如果右块高度比左块低，会不会导致左块的内容被溢出不显示之类的问题。应该是取左右2者的最高值吧来对齐吧”。的确应该是哪个div Height值大，就将其值赋给Height值小的div，从而使2个div

.NET

IT

C#

WEB

MVC

Jquery

转载 2011-10-29 00:08:44 349 阅读

24款非常实用的CSS3工具终极收藏

对于Web设计和开发人员来说，CSS是非常重要的一部分，随着越来越多的浏览器对CSS3的支持及不断完善，设计师和开发者们有了更多的选择。如今，用纯CSS就可以实现各种各样很酷的效果，甚至是动画。今天这篇文章向大家推荐24款非常优秀的CSS3工具，为了获得更佳的效果，请在Chrome 4+, Safari 4+, Firefox 3.6+, IE9+, Opera 10.5+版本浏览器中浏览如下

.NET

IT

C#

WEB

MVC

JQUERY

转载精选 2011-04-10 09:27:34 312 阅读

使用 CSS3 可以实现的五种很酷很炫的效果

CSS3 给 Web 开发带来了革命性的影响，以前很多需要 JavaScript 才能实现的复杂效果，现在使用 CSS3 就能简单的实现。如果你想了解 CSS3 可以做些什么的话，可以参考本文列出的 CSS3 能实现的很炫的应用。这些很酷的例子中有渐变、旋转、字体效果以及三维变换等等，尽情欣赏吧。 1. 制作精美的按钮 2. 实现很酷的字体效果

.NET

IT

C#

WEB

JQUERY

转载精选 2011-04-10 09:19:50 252 阅读

使用CSS为图片添加更多趣味的5种方法

1，阴影效果. 通过使用带有一些padding之的背景图来添加阴影效果。演示： http://www.sohtanaka.com/web-design/examples/drop-shadow/dropshadow.htm HTML： <img class=”shadow” src=”sample.jpg” alt=”

职场

HTML

CSS

休闲

Jquery

转载精选 2011-03-12 18:52:10 323 阅读 1点赞

5种方法立刻写出更好的CSS代码

当然，每个人都可以编写CSS代码，甚至你现在已经让它为你的项目工作了。但是CSS还可以更好吗？开始用这5个Tips改进你的CSS吧！ 1.重置首先，很认真的告诉你，总是要重置某些分类。无论你是使用 Eric Meyer Reset、YUI Reset 或者你自己编写的重置代码，只要使用就对了。它能很简单的移除所有元素的填充（padding）和边距（margin）： h

职场

HTML

CSS

休闲

Jquery

转载精选 2011-03-12 18:45:25 243 阅读

CSS技巧:详解清除浮动

在进行浮动布局时，大多数人都深知，在必要的地方进行浮动清理：<div style="clear:both;"></div>。例如： <div style="background:#666;">  &nbs

职场

HTML

CSS

休闲

Jquery

转载精选 2011-03-12 18:23:41 310 阅读

关于锚点跳转及jQuery下相关操作与插件

一、锚点跳转简介锚点嘛，业余点的解释就是可以让页面定位到某个位置的点。在高度较高的页面中经常见到，例如，百度百科页面，《火影忍者》这个词条，结果就会看到如下的锚点列表：点击其中一个链接，就会跳转到页面的相应位置。这就是锚点的作用之一。锚点还可以用在跳转到其他页面的相应位置，例如我的博客，点击博客首页文章下面的评论链接，则会跳转到文章的评论处。起关键作用的就是链接地址后面跟着的#

.NET

IT

C#

WEB

MVC

转载精选 2011-03-12 10:06:18 487 阅读

24个效果新颖的CSS3实例教程

Pure CSS3 Page Flip Effect 这是一个通过CSS3渐变、过渡、二维变换和剪裁技术, Roman Cortes 实现这一个纯CSS3的翻页效果 (没有用javascript). 当然也指定了Webkit 的浏览器 (Safari and Chrome). Create a Vibrant Digital Poster Design with CSS3 一个通过

.NET

IT

C#

WEB

MVC

转载精选 2011-03-11 23:41:31 484 阅读

10个纯CSS3实现的图片画廊及滑块

基于JavaScript实现的图片画廊/滑块插件技术有成百上千款可供您选择，所有的产品提供的功能都是不同的，都提供了交互功能，而且都是比较容易使用且安装的。于是，现在的问题是，为什么您就不考虑纯粹用CSS来替代？ CSS3是很是了不起。它正以惊人的速度及新技术、新想法，几乎每天都在更新，推动本身的能力越走越远，使得我们能够减少对JavaScript的依赖。想看这些效果请安装chrome或者fir

.NET

IT

C#

WEB

MVC

JQUERY

转载精选 2011-03-11 23:39:53 762 阅读

去掉点击链接时周围的虚线框及未点击时的蓝色框

去掉有链接的图片在未点击时出现的蓝色框，只需设 img { border : 0px ; }即可去掉。去掉点击链接时周围的虚线框：在html语句的<a></a>添加hidefocus属性 eg：<a href="#" hidefocus="true&

.NET

IT

C#

WEB

MVC

JQUERY

原创 2011-03-09 20:50:29 414 阅读

CSS3详解：border-radius

讲到css3的border-radius这个玩意，可以很好玩。比如：圆角矩形，圆，椭圆等等。 CSS3 border-radius是什么？ border-radius的含义是：圆角。 CSS3 border-radius的书写格式： border-radius:apx，比较常见，其中a表示数值，下同； -webkit-border-top-left-radius:apx，类似

.NET

IT

C#

WEB

MVC

Jquery

转载精选 2011-03-07 22:31:30 257 阅读

CSS transitions#CSS3变换入门

尽管人们期望在屏幕上有些改变，但是CSS和HTML对页面中的交互能做的实在太少了，而那些还需要用代码来实现。比如一个链接要么是这个颜色，要么是那个颜色；一个文本区域要么这么大，要么那么大；一张图片要么是透明的要么是不透明的；它们是从一个状态直接变到另一个状态——中间并没有过渡。　　这导致大部分网页有些生硬，因为元素只会很死板的切换或改变。　　是的，

.NET

IT

C#

WEB

JQUERY

转载精选 2011-02-28 13:26:13 237 阅读

CSS Sprites（CSS精灵）的应用

加速的关键，不是降低重量，而是减少个数。如果重量在200K以内，只要网络不是特别慢，效率都差不多。但是，如果图片个数多一倍，效率将明显低一个档次。　　传统切图讲究精细，图片规格越小越好，重量越小越好，其实规格大小无所谓，计算机统一都按Byte计算。客户端每显示一张图片都会向服务器发送请求，所以，图片越多请求次数越多，造成延迟的可能性也就越大。因为一张图片的传输时间，通常远小于请求等待的时间。

.NET

IT

C#

WEB

MVC

JQUERY

转载精选 2011-02-28 13:23:00 322 阅读

11个非常棒的CSS3实现的图片画廊

CSS3给WEB开发带来了革命性的影响，以前很多需要javascript实现的复杂效果，现在使用简单的CSS3就能实现。下面这些绚丽的图片画廊效果就是用CSS3实现的。还有件非常有趣的事就是很多人都在使用宝丽来效果。(提示：点击图片即可浏览Demo，为了能查看完整效果，请使用 Safari、Chrome、Opera浏览器浏览) Polaroid from Tutorialzin

.NET

IT

C#

WEB

MVC

JQUERY

转载精选 2011-02-28 13:14:14 539 阅读

CSS Sprites技术使用方法工具技巧

制作CSS Sprites 图片在线工具:http://cn.spritegen.website-performance.org/ 之前介绍的网站优化之减少HTTP请求曾介绍过CSS Sprites，CSS Sprites并没有一个确定的中文翻译，通常被意译为“CSS图像拼合”或“CSS贴图定位”。CSS Sprites并不是一门新技术，目前它已经

.NET

IT

C#

WEB

MVC

转载精选 2011-02-22 12:55:00 502 阅读

CSS Sprites + Rounded corners

Introduction Yes, I know that there are thousands of tutorials regarding rounded corners with CSS, but anyway, I wanted to show you this way too. Hopefully, you will find it useful. It's import

.NET

IT

C#

MVC

Jquery

转载精选 2011-02-22 12:49:48 501 阅读

Creating easy and useful CSS Sprites

Online Tool to make CSS Sprites:http://cn.spritegen.website-performance.org/ Let's start with the basics. What are CSS sprites? CSS sprites are a way to combine p_w_picpaths to improve our page load

IT

C#

WEB

MVC

Jquery

转载精选 2011-02-22 12:44:22 437 阅读

CSS Sprites 样式生成工具

学CSS布局的同学应该多少知道CSS Sprites（图片合并）技术，简单的说就是利用CSS的background-position属性，控制显示一张大图片的显示区域。例子可以看这里《 CSS Sprites: Image Slicing’s Kiss of Death》。对于经常使用CSS Sprites的同学，不知道是否有跟我一样的烦恼，在写定位的时候，先在PS里量出大概的

.NET

HTML

WEB

CSS

休闲

转载精选 2011-02-05 20:12:06 608 阅读

Css Sprite原理优缺点及使用

CSS Sprites在国内很多人叫css精灵，是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去，这样一来，当访问该页面时，载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。对于当前网络流行的速度而言，不高于200KB的单张图片的所需载入时间基本是差不多的，所以无需顾忌这个问题。加

.NET

HTML

WEB

CSS

休闲

转载精选 2011-02-05 20:09:01 398 阅读

官方博客	全部文章	热门标签	班级博客
了解我们	网站地图	意见反馈

鸿蒙开发者社区	51CTO学堂
51CTO	软考资讯

51CTO博客

分享，交流

如何让2个并列的div根据内容自动保持同等高度

24款非常实用的CSS3工具终极收藏

使用 CSS3 可以实现的五种很酷很炫的效果

使用CSS为图片添加更多趣味的5种方法

5种方法立刻写出更好的CSS代码

CSS技巧:详解清除浮动

关于锚点跳转及jQuery下相关操作与插件

24个效果新颖的CSS3实例教程

10个纯CSS3实现的图片画廊及滑块

去掉点击链接时周围的虚线框及未点击时的蓝色框

CSS3详解：border-radius

CSS transitions#CSS3变换入门

CSS Sprites（CSS精灵）的应用

11个非常棒的CSS3实现的图片画廊

CSS Sprites技术使用方法工具技巧

CSS Sprites + Rounded corners

Creating easy and useful CSS Sprites

CSS Sprites 样式生成工具

Css Sprite原理优缺点及使用