wiki:css:css_note:css_opacity

차이

문서의 선택한 두 판 사이의 차이를 보여줍니다.

차이 보기로 링크

--- wiki:css:css_note:css_opacity [2021/03/30 14:10]
emblim98 만듦
+++ wiki:css:css_note:css_opacity [2023/01/13 18:44] (현재)
@@ 줄 211: / 줄 211: @@
 </HTML>
 =====Text in Transparent Box=====
+{{:wiki:css:css_note:transbox.png?600|}}\\
 <HTML>
+<!DOCTYPE html>
+<html>
+<head>
+    <style>
+        div.background {
+            background: url(klematis.jpg);
+            border: 2px solid black;
+        }
+        div.transbox {
+            margin: 30px;
+            background-color: #ffffff;
+            border: 1px solid black;
+            opacity: 0.6;
+        }
+        div.transbox p {
+            margin: 5%;
+            font-weight: bold;
+            color: #000000;
+        }
+    </style>
+</head>
+<body>
+    <div class="background">
+        <div class="transbox">
+            <p>This is some text that is placed in the transparent box.</p>
+        </div>
+    </div>
+</body>
+</html>
 </HTML>
+====예제 설명====
+먼저, 배경 이미지와 테두리가 있는 %%<div>%% 요소 (class="background")를 만듭니다.\\
+\\
+그런 다음, 첫 번째 %%<div>%% 안에 또 다른 <div> (class = "transbox")를 만듭니다.\\
+\\
+%%<div class="transbox">%%에는 배경색과 테두리가 있습니다. div는 투명합니다.\\
+\\
+투명한 <div> 내부의 <p> 요소 안에 텍스트를 추가합니다.\\
+\\

/var/services/web/dokuwiki/data/attic/wiki/css/css_note/css_opacity.1617081047.txt.gz · 마지막으로 수정됨: 2022/03/10 19:52 (바깥 편집)