CSS로 + 버튼을 만드는 방법은 무엇입니까?

Question

당신이 입력 구글에 "구글"할 때, 당신은 + 버튼을 GOOG

불을 지르고와

, 당신은 <div class="csb mbi">을 볼 수에 대한

쇼 주식 시세가 볼 수는의 내용을 무엇인가 클래스

CSB MBI

나는 그런 버튼을 만들

, d를 클릭하면 버튼이됩니다. 그것을하는 방법?

Answer 1

가 여기에 +/- 버튼을, 아니 이미지 예입니다 :

http://www.google.cz/images/nav_logo7.png 

그런 것들을 검사를위한, 불을 지르고를 사용합니다. 모든 텍스트와 CSS.

http://jsbin.com/ikeca

alt text http://i47.tinypic.com/mcvjg9.jpg

Answer 2

버튼은 실제로는 단지 이미지입니다. Google은 사이트에 대한 링크와 이미지가 포함 된 이미지를로드하고 표시하려는 부분을 표시하기 위해 배경의 표시를 조정합니다.

이들은 자신이하고있는 것을 달성하는 데 필요한 주요 스타일입니다.

background:transparent url(/images/nav_logo7.png) no-repeat scroll 0 0; 
height:13px; 
overflow:hidden; 
width:13px; 
background-position:-91px -74px; 

FireBug를 사용할 때 CSS를 검사하여이 모든 것을 확인할 수 있습니다.

Answer 3

는이 이미지입니다 :

http://www.firebug.com