연습장:Sakura/1: 두 판 사이의 차이

편집 요약 없음
태그: 되돌려진 기여
편집 요약 없음
태그: 되돌려진 기여
1번째 줄: 1번째 줄:
{| class ="wikitable" style="font-size: 10pt; max-width: 400px; border: 2px solid #0095DA; float: right; text-align: center;"
| colspan="2" style="color: #FFF; background:#0095DA;" | '''한나라당 전국위원회 의장<br><big><big>최성자</big></big><br>崔聖子 | Choi Sung-ja'''
|-
| colspan="2" |<div style="margin: -5.0px -9.0px">[[파일:최성자 (한나라).png|400px]]</div>
|-
| rowspan="2" style="width: 25%;color: #FFF; background: #0095DA;" | '''출생'''
| style="width: 75%; text-align: left;" | {{출생일과 나이 (한나라)|1965|9|3}}
|-
| style="text-align: left;" | [[함경북도 (한나라)|함경북도]] [[경원시 (한나라)|경원시]]
|-
| style="color: #FFF; background: #0095DA;" | '''거주지'''
| style="text-align: left;" | [[경기도 (한나라)|경기도]] [[성남시 (한나라)|성남시]] [[서초구 (한나라)|서초구]] 잠원동<br>래미안 신반포 팰리스<br>[[함경북도 (한나라)|함경북도]] [[경원시 (한나라)|경원시]] 증산동 산 28-5<ref>200평정도 되는 땅에 컨테이너 하우스만 하나 있다.</ref>
|-
| style="width: 25%;color: #FFF; background: #0095DA;" | '''본관'''
| style="width: 75%; text-align: left;" | 경주 최씨
|-
| style="color: #FFF; background: #0095DA;" | '''현직'''
| style="text-align: left;" | [[한나라당 (한나라)|한나라당]] 전국위원회 의장<br>제40대 민의원 의원<br>한나라당 경원·온성 갑 당협위원장
|-
| style="color: #FFF; background: #0095DA;" | '''서명'''
| style="text-align: left;" | [[파일:최성자 서명 (한나라).png|x50px]]
|-
| style="color: #FFF; background: #0095DA;" | '''링크'''
| style="text-align: left;" | [[파일:네이버_블로그_아이콘.svg|x20px|link=http://warning.or.kr/]] [[파일:인스타그램_아이콘.png|x20px|link=http://warning.or.kr/]] [[파일:페이스북_아이콘.svg|x20px|link=http://warning.or.kr/]] [[파일:트위터_아이콘.png|x20px|link=http://warning.or.kr/]] [[파일:유튜브_아이콘.png|x16px|link=http://warning.or.kr/]]
|-
| colspan="2" |
<div class="accordion-header" style="width: 100%; text-align: center; background-color: transparent;">'''[ 펼치기 · 접기 ]'''</div>
<div class="accordion-content">
{| style="margin-left: -2px; margin-right: -15px; margin-bottom: -12px; width: calc(100% + 5px); text-align: center; margin-top:-2px "
| style="width: 25%;color: #FFF; background: #0095DA;" | '''형제자매'''
| style="width: 75%;text-align: left;" | 1남 3녀 중 둘째
|-
| style="color: #FFF; background: #0095DA;" | '''가족'''
| style="text-align: left;" | 부 [[최영식 (한나라)|최영식]], 모 이영자
|-
| style="color: #FFF; background: #0095DA;" | '''배우자'''
| style="text-align: left;" | 김종필
|-
| style="color: #FFF; background: #0095DA;" | '''자녀'''
| style="text-align: left;" | 슬하 2남 [[김은지 (한나라)|1녀]]
|-
| style="color: #FFF; background: #0095DA;" | '''학력'''
| style="text-align: left;" | 유덕여자고등학교 <small>(졸업 / 3회)</small><br>이화여자대학교 사회과학대학 <small>(행정학 / 학사)</small>
|-
| style="color: #FFF; background: #0095DA;" | '''종교'''
| style="text-align: left;" | 무종교
|-
| style="color: #FFF; background: #0095DA;" | '''정당'''
| style="text-align: left;" | {{한나라당 (한나라)}}
|-
| style="color: #FFF; background: #0095DA;" | '''계파'''
| style="text-align: left;" | [[서리풀연구회 (한나라)|서리풀연구회]] <small>(최고고문)</small>
|-
| style="color: #FFF; background: #0095DA;" | '''지역구'''
| style="text-align: left;" | [[함경북도 (한나라)|함경북도]] [[경원시·온성군 갑 (한나라)|경원·온성 갑]]
|-
| style="color: #FFF; background: #0095DA;" | '''의원선수'''
| style="text-align: left;" | '''11'''(민)
|-
| style="color: #FFF; background: #0095DA;" | '''의원대수'''
| style="text-align: left;" | [[제30대 민의원 의원 (한나라)|30]] [[제31대 민의원 의원 (한나라)|31]] [[제32대 민의원 의원 (한나라)|32]] [[제33대 민의원 의원 (한나라)|33]] [[제34대 민의원 의원 (한나라)|34]] [[제35대 민의원 의원 (한나라)|35]] [[제36대 민의원 의원 (한나라)|36]] [[제37대 민의원 의원 (한나라)|37]] [[제38대 민의원 의원 (한나라)|38]] [[제39대 민의원 의원 (한나라)|39]] [[제40대 민의원 의원 (한나라)|40]]
|-
| style="color: #FFF; background: #0095DA;" | '''약력'''
| style="text-align: left;" | 제30~40대 민의원 <small>([[함경북도 (한나라)|함경북도]] [[경원시·온성군 갑 (한나라)|경원·온성 갑]])</small><br>한나라당 총무회장<br>제10대 여성가족대신
|-
|}</div>
|}
<html>
<html>
<style>
  <head>
.accordion-header {
    <style>
  cursor: pointer;
      .collapsible {
  font-weight: bold;
        background-color: #777;
}
        color: white;
        cursor: pointer;
        padding: 18px;
        width: 100%;
        border: none;
        text-align: left;
        outline: none;
        font-size: 15px;
        transition: 0.4s;
      }


.accordion-content {
      .content {
  max-height: 0;
        padding: 0 18px;
  overflow: hidden;
        display: none;
  transition: max-height 0.2s ease-out;
        overflow: hidden;
}
        background-color: #f1f1f1;
        transition: max-height 0.2s ease-out;
      }


.accordion-content.active {
      .active, .collapsible:hover {
  max-height: 500px;
        background-color: #555;
}
      }
</style>
    </style>
  </head>
  <body>


<script>
    <h2>펼치기/접기 테스트</h2>
const accordionHeaders = document.querySelectorAll('.accordion-header');
   
    <button class="collapsible" id="collapsible">펼치기/접기</button>
    <div class="content" id="content">
      <p>펼침/접음 내용</p>
    </div>


accordionHeaders.forEach(header => {
    <script>
  header.addEventListener('click', () => {
      var coll = document.getElementById("collapsible");
    header.nextElementSibling.classList.toggle('active');
      var content = document.getElementById("content");
  });
 
});
      coll.addEventListener("click", function() {
</script>
        this.classList.toggle("active");
        if (content.style.display === "block") {
          content.style.height = "0px";
          content.style.width = "0px";
          content.style.border = "none";
          setTimeout(function() {
            content.style.display = "none";
          }, 400);
        } else {
          content.style.display = "block";
          var height = content.scrollHeight + "px";
          content.style.height = height;
          content.style.width = "100%";
          content.style.border = "1px solid black";
        }
      });
    </script>
 
  </body>
</html>
</html>

2023년 2월 19일 (일) 19:31 판

펼치기/접기 테스트

펼침/접음 내용