연습장:Yuc: 두 판 사이의 차이

  • 최근 수정 시각: 2024년 12월 12일 (목) 15:48
  • 창작 문서는 문서 별 라이선스를 확인하세요. 실용 문서는 다른 조건이 없는 한 크리에이티브 커먼즈 저작자표시-동일조건변경허락 3.0에 따라 사용할 수 있습니다. 자세한 내용은 이용 약관을 참고하세요.
    이용자 보호 창구 | evewiki.kr@gmail.com후원계좌 | 100-152-076102 케이뱅크 김성보
편집 토론 역사
편집 요약 없음
편집 요약 없음
3번째 줄: 3번째 줄:
     <meta charset="UTF-8">
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>공지 팝업</title>
     <title>저작물 라이선스</title>
     <style>
</head>
         /* 팝업 배경 */
<body>
         .popup-overlay {
 
             display: none; /* 기본값: 숨김 */
     <div style="max-width: 800px; margin: 0 auto; padding: 20px; background-color: #fff; border-radius: 15px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);">
             position: fixed;
         <h1 style="text-align: center; color: #003366; font-size: 2em; margin-bottom: 20px;">저작물 라이선스</h1>
             top: 0;
 
            left: 0;
        <div style="margin-bottom: 20px;">
             width: 100%;
            <h2 style="color: #003366; font-size: 1.5em;">《개요》</h2>
             height: 100%;
            <p>본 라이선스는 카엘리아 스튜디오(이하 "저작자")의 저작물에 대한 사용,배포,수정,2차창작 등 제작 및 기타 이용에 대해 다룹니다.</p>
             background: rgba(0, 0, 0, 0.7);
        </div>
             z-index: 1000;
 
        }
         <div style="margin-bottom: 20px;">
             <h2 style="color: #003366; font-size: 1.5em;">《제1조》 저작물</h2>
            <p>이 라이선스의 "<span style="color: #003366; font-weight: bold;">저작물</span>"이란 저작자의 모든 창작물 및 관련된 모든 텍스트, 이미지, 데이터, 코드 등 기타 자료를 포함합니다.</p>
        </div>
 
        <div style="margin-bottom: 20px;">
             <h2 style="color: #003366; font-size: 1.5em;">《제2조》 사용자</h2>
             <p>"<span style="color: #003366; font-weight: bold;">사용자</span>"란 이 라이선스에 따라 저작물을 사용하는 모든 개인 또는 단체를 의미합니다.</p>
        </div>
 
        <div style="margin-bottom: 20px;">
             <h2 style="color: #003366; font-size: 1.5em;">《제3조》 허용된 사용</h2>
             <ul style="line-height: 1.8;">
 
             <p><span style="color: #003366; font-weight: bold;">1.</span> 저작물의 비영리적 복제, 배포, 이용</p>
 
            <p><span style="color: #003366; font-weight: bold;">2.</span> 2차 창작, 팬픽</p>
 
            <p><span style="color: #003366; font-weight: bold;">3.</span> 시간 벌기</p>
 
            <p><span style="color: #003366; font-weight: bold;">4.</span> 타임캡슐에 넣기</p>
            </ul>
        </div>
 
        <div style="margin-bottom: 20px;">
             <h2 style="color: #003366; font-size: 1.5em;">《제4조》 금지된 사용</h2>
            <ul style="line-height: 1.8;">


        /* 팝업 박스 */
             <p><span style="color: #003366; font-weight: bold;">1.</span> 저작물의 영리적 복제, 배포, 이용</p>
        .popup-content {
            position: absolute;
            top: -100%;
            left: 50%;
            transform: translateX(-50%);
            width: 90%;
             max-width: 450px;
            background: #ffffff;
            border-radius: 20px;
            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
            padding: 30px;
            text-align: center;
            animation: slideDown 0.5s ease-out forwards;
        }


        /* 헤더 스타일 */
             <p><span style="color: #003366; font-weight: bold;">2.</span> 허가받지 않은 저작물 무단 수정</p>
        .popup-content h2 {
             font-size: 24px;
            font-weight: bold;
            color: #333;
            margin-bottom: 10px;
        }


        /* 본문 스타일 */
            <p><span style="color: #003366; font-weight: bold;">3.</span> 악의적 편집</p>
        .popup-content p {
            font-size: 16px;
            color: #555;
            line-height: 1.5;
            margin-bottom: 20px;
        }


        .popup-content small {
             <p><span style="color: #003366; font-weight: bold;">4.</span> 모조리 씹어먹기</p>
             font-size: 14px;
             </ul>
             color: #888;
         </div>
         }


         /* 닫기 버튼 */
         <div style="margin-bottom: 20px;">
        .close-btn {
             <h2 style="color: #003366; font-size: 1.5em;">《부칙》</h2>
            display: inline-block;
             <ul style="line-height: 1.8;">
            margin-top: 20px;
             background: #FF4C4C;
            color: white;
            border: none;
            padding: 12px 25px;
            cursor: pointer;
            border-radius: 25px;
            font-size: 16px;
             font-weight: bold;
            transition: all 0.3s ease;
        }


        .close-btn:hover {
             <p><span style="color: #003366; font-weight: bold;">1.</span> 이 라이선스는 개국 633년 12월 12일부터 효력을 발휘합니다.</p>
             background: #FF0000;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
        }


        /* 애니메이션 효과 */
             <p><span style="color: #003366; font-weight: bold;">2.</span> 이 라이선스는 저작자가 수정 및 철회할 수 있으며, 수정된 라이선스는 공고된 날로부터 효력을 발휘합니다.</p>
        @keyframes slideDown {
             from {
                top: -100%;
            }
            to {
                top: 25%;
            }
        }


        @keyframes slideUp {
            from {
                top: 25%;
            }
            to {
                top: -100%;
            }
        }
    </style>
</head>
<body>
    <!-- 팝업 -->
    <div class="popup-overlay" id="popup">
        <div class="popup-content" id="popup-content">
            <h2>📢 공지</h2>
            <p><small>Caelia Studio</small><br>여기에 내용을 입력하세요.
<br><small>(2024. nn. nn.)</small></p>
            <button class="close-btn" onclick="closePopup()">닫기</button>
         </div>
         </div>
     </div>
     </div>


    <script>
        // 페이지 로드 시 팝업 표시
        document.addEventListener("DOMContentLoaded", function () {
            const popup = document.getElementById("popup");
            popup.style.display = "block"; // 팝업 표시
        });
        // 팝업 닫기
        function closePopup() {
            const popupContent = document.getElementById("popup-content");
            popupContent.style.animation = "slideUp 0.5s ease-out forwards"; // 닫기 애니메이션
            popupContent.addEventListener("animationend", function () {
                const popup = document.getElementById("popup");
                popup.style.display = "none"; // 팝업 숨김
            }, { once: true });
        }
    </script>
</body>
</body>
</html>
</html>

2024년 12월 12일 (목) 15:48 판

저작물 라이선스

저작물 라이선스

《개요》

본 라이선스는 카엘리아 스튜디오(이하 "저작자")의 저작물에 대한 사용,배포,수정,2차창작 등 제작 및 기타 이용에 대해 다룹니다.

《제1조》 저작물

이 라이선스의 "저작물"이란 저작자의 모든 창작물 및 관련된 모든 텍스트, 이미지, 데이터, 코드 등 기타 자료를 포함합니다.

《제2조》 사용자

"사용자"란 이 라이선스에 따라 저작물을 사용하는 모든 개인 또는 단체를 의미합니다.

《제3조》 허용된 사용

    1. 저작물의 비영리적 복제, 배포, 이용

    2. 2차 창작, 팬픽

    3. 시간 벌기

    4. 타임캡슐에 넣기

《제4조》 금지된 사용

    1. 저작물의 영리적 복제, 배포, 이용

    2. 허가받지 않은 저작물 무단 수정

    3. 악의적 편집

    4. 모조리 씹어먹기

《부칙》

    1. 이 라이선스는 개국 633년 12월 12일부터 효력을 발휘합니다.

    2. 이 라이선스는 저작자가 수정 및 철회할 수 있으며, 수정된 라이선스는 공고된 날로부터 효력을 발휘합니다.