开发者

styling button and button:hover from transparent png

开发者 https://www.devze.com 2023-03-08 16:03 出处:网络
There is a button and it\'s style (background) is loaded form the same PNG image. Could somebody tell me how does it work?

There is a button and it's style (background) is loaded form the same PNG image. Could somebody tell me how does it work?

example:

site - http://www.brushlovers.com/photoshop-brush/dotted-neon-lines.html

PNG - http://www.brushlovers.com/web/css/i开发者_开发问答mages/sprite.png

Thanks!

These properties are responsible for this?

width: 19px;
height: 20px;
background-position-x: -209px;
background-position-y: -80px;


They're using a technique known as CSS Sprites.

Here's a thorough explanation:

http://www.smashingmagazine.com/2009/04/27/the-mystery-of-css-sprites-techniques-tools-and-tutorials/

Here's a tutorial specifically instructing how to make a button using this technique:

http://inspectelement.com/tutorials/create-a-button-with-hover-and-active-states-using-css-sprites/

0

精彩评论

暂无评论...
验证码 换一张
取 消