CSS 버튼 색상

수다왕

프로필 보기 이 회원 글보기 이 회원의 댓글보기

· 8년 전 · 조회 4149 4149

CSS 버튼 색상

버튼 색상

녹색 푸른 빨간 회색 검은

이 background-color속성을 사용하여 버튼의 배경색을 변경하십시오.

예

.button1 {background-color: #4CAF50;} /* Green */

.button2 {background-color: #008CBA;} /* Blue */

.button3 {background-color: #f44336;} /* Red */

.button4 {background-color: #e7e7e7; color: black;} /* Gray */

.button5 {background-color: #555555;} /* Black */

[전체소스]

<!DOCTYPE html>

<html>

<head>

<style>

.button {

background-color: #4CAF50; /* Green */

border: none;

color: white;

padding: 15px 32px;

text-align: center;

text-decoration: none;

display: inline-block;

font-size: 16px;

margin: 4px 2px;

cursor: pointer;

}

.button2 {background-color: #008CBA;} /* Blue */

.button3 {background-color: #f44336;} /* Red */

.button4 {background-color: #e7e7e7; color: black;} /* Gray */

.button5 {background-color: #555555;} /* Black */

</style>

</head>

<body>

<h2>Button Colors</h2>

<p>Change the background color of a button with the background-color property:</p>

<button class="button">Green</button>

<button class="button button5">Black</button>

</body>

</html>

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시판 목록

퍼블리셔팁

퍼블리싱과 관련된 유용한 정보를 공유하세요.
질문은 상단의 QA에서 해주시기 바랍니다.

글쓰기

번호	분류	제목	글쓴이	날짜	조회
767		신입 개발 ->디자인 ->퍼블로 왔습니다! [4]	웹표준3년차 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	3958
766		jQuery Tree 를 만들었습니다.~~ [2]	kiplayer 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	2879
765		퍼블리셔 수습기간인데 질문드립니다. [12]	DavidCorleone 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	4010
764	기타	swip 사용 안하고, touchstart, touchmove 사용하여 슬라이드 구현 [1]	돼지코구뇽 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	4687
763	기타	많이들 사용하시는 Slider 에 대해서... [3]	kiplayer 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	9537
762	기타	텝메뉴 상단고정 및 해당위치 스크롤 [5]	표블리셔 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	9101
761	기타	유튜브 재생 중인 팝업 레이어 숨길 때 재생 멈추는 방법 [2]	지운아빠 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	8791
760	반응형	반응형 코딩할때 height:100% 에 관해서... [3]	ABC디자인 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9년 전	12948
759	기타	ie 와 크롬 폰트 부분해결할 수 있는건지좀 알려주시면 감사드립니다. [1]	바른통남 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	3988
758	CSS	당신은 모를 수도 있는 CSS의 7가지 단위 [4]	JRevirthuum 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	6001
757	HTML	모바일 작업시 숫자인식,메일주소, 지도상의 주소링크 막기	임예니 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	3925
756	기타	구글의 material design에 관한 설명입니다. [4]	JRevirthuum 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	4807
755	CSS	css가 충돌이 됬을때 [4]	돼지코구뇽 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	15859
754	HTML	HTML Canvas 2D Context	RINIX 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	6134
753	HTML	HTML5 자바스크립트 API [1]	RINIX 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	4892
752	기타	ShadowDOM Visualizer	JRevirthuum 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	6082
751	반응형	각 해상도별 테스트. [8]	LaRuota 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	7236
750	HTML	결제모듈과 구글웹사이트 번역 엘리먼트	박쥐12 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	7953
749	HTML	팁] 모바일에서 문자보내기 [2]	카츠 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	7419
748	반응형	짧고 굵은거 [1]	옵션 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	6722
747	반응형	반응형 가변(가로, 세로) 아이프레임 제이쿼리 플러그인 [13]	묵공 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10년 전	12341
746	기타	계륵.. css3, jquery 를 이용한 랜덤 돌림판 포인트게임	뽁스 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	13536
745	CSS	익스8이하에서 css3을 사용하기 [3]	잘살아보자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	6449
744	CSS	레이어팝업 가로 중앙 위치 시키기 [3]	잘살아보자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	12346
743	기타	ie8에 font awesome 적용 방법 [6]	지운아빠 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	7905
742	HTML	팁]모바일에서 전화 걸기 [1]	잘살아보자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	6579
741	기타	파비콘 넣는 방법이에요. [1]	잘살아보자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	6936
740	CSS	css !important 의 활용 [3]	잘살아보자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	6402
739	CSS	sprite 이미지를 css코드로 변환해주는 웹도구 [3]	우산11 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	5734
738	기타	영역 스크롤 질문드립니다. [1]	별이님 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11년 전	3623