목록쭈구리 코딩/내가 보고 쓰려고 모은 것 (37)
땀나는 애

[특이점] 1. 도트점 원의 모양을 after로 만듬 :after {content:"";display:block;width:100%;height:100%;position:absolute;left:0;top:0;z-index:1;box-sizing:border-box;border:1px dashed #bedcdd;border-radius:50%;-webkit-border-radius:50%;} 2. transform:scale 사용 [transform] CSS transform 속성으로 요소에 회전, 크기 조절, 기울이기, 이동 효과를 부여할 수 있습니다. transform은 CSS 시각적 서식 모델의 좌표 공간을 변경합니다. 시각적 서식 모델 씨에스에스 시각적 서식 모델 ( visual formattin..
페이지나 박싱 넘어가는 글자 넘침현상 해결하기 width:500px;overflow:hidden;word-wrap:break-word;word-break:break-all; (영어 넘침 해결 위에서는 word-break:break-all 넣음) 말 줄임표 1줄 말 줄임표 width:500px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap N줄 말 줄임표 overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; /* 라인수 */ -webkit-box-orient: vertical; word-wrap:break-word; line-height: 1.2e..
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 @media all and (max-width:600px){ /* 모바일 테이블 가로스크롤 */ .mb_scroll{position:relative} .mb_scroll .tbBox{position:relative;padding-top:30px;width:100%;overflow:auto} .mb_scroll table{width:640px} .mb_scroll::before{position:absolute;top:0;left:5..
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 Document .imgUp a {height: 100%; transition: transform .2s ease, padding .2s ease;display:inline-block} .imgUp a:hover {padding-bottom: 50px; transform: translate(0,-50px);} http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter

동래구청 홈페이지에 오신것을 환영합니다. /* mc_often */ #mc_often { width:900px; height:290px; transition:height 2s ease-in-out; box-shadow:0 10px 20px rgba(0,0,0,0.2); } #mc_often li span {background-image:url(mc_quick_icon1.png)} #mc_often { background:#fff; } #mc_often li { float:left; width:180px } #mc_often li a {position:relative; display:block; height:145px; border-top:1px solid #e0e0e0; border-right:1px s..
.zeta-menu li { float: left; list-style: none; position: relative; } .zeta-menu li:hover { background: pink; } .zeta-menu li.expand { background: white; } .zeta-menu li.expand>a { color: hotpink; } .zeta-menu a { color: black; display: block; padding: 10px 20px; text-decoration: none; } .zeta-menu ul { background: #eee; border: 1px solid silver; display: none; padding: 0; position: absolute; lef..
아코디언 .join1_box{position:relative;border:1px solid #bbb;padding:20px;margin-bottom:10px} .join1_box input{display:none} .join1_box h4 {position:relative;font-size:18px;font-weight:bold;color:#292929;width:100%} .join1_box h4 strong{;font-size:16px;font-weight:bold;color:#ef1c26;} .join1_box h4 label{position:absolute;top:0;right:0;width:31px;height:30px;background:url(../../images/join/chk_off.g..
$(document).ready(function() { $(".toggle p").hide(); // $(".toggle > li:first-child a").next().show(); $(".toggle li a").on("click", function() { $(".toggle li a").not(this).removeClass("active"); $(this).addClass("active") $(this).next().slideToggle(300); // $(this).next().slideDown(300); $(".toggle li a").not(this).next().slideUp(300); return false; }); $(".toggle li a").eq(0).trigger("click"..