Home
CSS
CSS 실전 예제

내용을 투명하게 만드는 방법 - opacity

opacity로 요소의 투명도를 정할 수 있습니다. 0부터 1.0까지의 수를 넣습니다. 숫자가 작을수록 투명해집니다

opacity

opacity로 투명도를 정할 수 있습니다.

 

기본형

opacity : number
  • number : 0 부터 1.0 까지의 수를 넣습니다.
  • 숫자가 작을수록 투명해집니다.

 

예제

<div class="a">
  <h1>Lorem Ipsum Dolor.</h1>
</div>

<div class="b">
  <h1>Lorem Ipsum Dolor.</h1>
</div>
div {
  width: 80%;
  padding: 50px 0px;
  text-align: center;
  color: #ffffff;
}
.a {
  border: 1px solid #212121;
  background-color: #212121;
}
.b {
  border: 1px solid #ff9800;
  background-color: #ff9800;
  position: fixed;
  top: 100px;
  left: 100px;
  opacity: 0.7;
}

로딩 중... 잠시만 기다려주세요.
자바스크립트를 허용해주세요.

Post a Comment