css background 위에 black overlay
본문
= 구현을 어떻게 해야될까요?
다 회색빛으로 가려질뿐이네요~
답변 3
네이비칼라님의 내용에서 조금더 보충해 주었습니다.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
#image{position:relative;width:300px;height:300px;background:url(이미지경로)}
#boverlay{position:absolute;top:0;left:0;width:300px;height:300px;background:#000;opacity:0.4}
</style>
</head>
<body>
<div id="image">
<span id="boverlay"></span>
</div>
</body>
</html>
<style>
#image{position:relative;width:300px;height:300px;background:url(이미지경로)}
#boverlay{position:absolute;top:0;left:0;width:300px;height:300px;opacity:0.65;}
</style>
<div id="image">
<span id="boverlay"></span>
</div>
이런 식으로 처리하면 될텐데요 ㅎㅎ
image 클래스 또는 아이디라면
image:hover 로 사용시 마우스오버시 효과가 사용됩니다.
답변을 작성하시기 전에 로그인 해주세요.