본문 바로가기

Publishing51

reset.css CDN https://www.jsdelivr.com/package/npm/reset-css jsDelivr - A free, fast, and reliable CDN for Open Source Supports npm, GitHub, WordPress, Deno, and more. Largest network and best performance among all CDNs. Serving more than 80 billion requests per month. Built for production use. www.jsdelivr.com 2020. 8. 12.
사이트 기본 와이어프레임 2020. 8. 11.
Image Guide 이미지 스프라이트 운영성 이미지 성격이 아닌 아이콘 또는 장식을 위한 이미지 요소들은 스프라이트 기법을 활용하여 파일의 Size, Request 최소화를 도모한다. 이미지 타입 선택 프로젝트 종류에 따른 이미지 타입표종류PC webMobile WebMobile AppGIFJPGPNG-8PNG-24이미지 스프라이트 AppGIFJPGPNG-8PNG-24이미지 스프라이트 종류 PC web Mobile Web Mobile App GIF 기본 사용 가능 X JPG 컬러수 많거나 운영성 이미지일 때 운영성 이미지일 때 X PNG-8 X 기본 반투명효과 없고 컬러가 적을 때 PNG-24 반투명효과가 있을 때에만 사용 컬러 수 많거나 반투명효과가 있을 때 기본 이미지 스프라이트 O O X PC Web 기본 포맷은 GI.. 2020. 8. 5.
Naming Guide prefix/subfix/suffix 정의후보자 접두사를 의미하는 것으로, 앞부분에 사용하며, 주로 형태를 나타내는 데 사용된다. ex) tab_notice, tbl_product 등 기본 프리픽스는 형태별로 통일한다. 서브 프리픽스가 필요한 부분은 underscore로 구분하여 표기한다 (line / line_dot) 프리픽스 리스트에 한해 subfix, suffix에서 축약형 네이밍 사용한다 (이외 네이밍은 의미전달 가능하도록 기재) - prefix 2개 이상 중복 시 기능적인 prefix가 맨 앞부분에 위치할 수 있도록 한다. - 단독사용 클래스는 지양하며 prefix를 조합한 형태로 작성한다. 예외:fst, lst, hide, onon 클래스인 경우, 단일 특정요소에 상태변화 클래스를 적용한다면 .. 2020. 8. 5.
Event Page 코딩하기 https://www.melon.com/event/ticket/index.htm?gubunId=&keyword=&pageIndex=0 멜론과 멜론티켓의 꿀케미 혜택! 멜론 GOLD이상 누구나! 멜론티켓 예매수수료 무료! 음악이 필요한 순간, 멜론 www.melon.com 멜론 VIP 혜택관 오직 멜론 VIP만을 위한 특별한 문화 혜택 Melon x Melon 티켓 MVG 멜론과 멜론티켓의 슈퍼꿀케미파워! 멜론 GOLD 이상, 누구나! 예매 횟수 제한없이, 무제한! 정말 쉬운 방법으로, 간편하게! 멜론 티켓 수수료 무료 0원 정말 쉬운 헤택받는 방법! 보고 싶은 공연을 클릭하면 결제 시 자동으로 수수료 무료 혜택 제공! Tip 아래에서 꿀잼공연 추천해드릴게요~ 뮤지컬 〈모차르트!〉 10주년 기념공연 202.. 2020. 8. 4.
회원가입 폼 http://flato.kr/work/2000n/s503_write.html 이천시동행누리센터 동서양의 아름다운 정원을 품은 이천시동행누리센터으로 여러분을 초대합니다. flato.kr 2020. 7. 24.
input password에 텍스트가 보이지 않을 경우 input[type=password] { font-family: 'Malgun Gothic'; } 2020. 4. 19.
미디어쿼리 @media screen and (min-width:1280px) and (max-width:1599px) { } @media screen and (min-width:1024px) and (max-width:1279px) { } @media screen and (min-width:780px) and (max-width:1023px) { } @media screen and (min-width:640px) and (max-width:779px) { } @media screen and (min-width:480px) and (max-width:639px) { } @media screen and (max-width:479px){ } 2020. 4. 10.
유용한 css js 라이브러리 WAW.js https://wowjs.uk/ wow.js — Reveal Animations When Scrolling wowjs.uk CSS3Animate https://jackonthe.net/css3animateit/ CSS3 Animate It Examples - Animate Elements on Scroll Sequencing If you want to have a set of animations start one after the other then you can set a sequence time in ms using "data-sequence" then define the order with "data-id". It Works! This animation will start 500ms a.. 2020. 3. 31.
SASS 기본 중첩 HTML 을 작성할 때 분명히 중첩되고 시각적인 계층 구조가 있음을 알게 될 것입니다. 반면에 CSS 는 그렇지 않습니다. Sass를 사용하면 HTML 의 동일한 시각적 계층 구조를 따르는 방식으로 CSS 선택기 를 중첩시킬 수 있습니다 . 지나치게 중첩 된 규칙은 유지하기 어려울 수 있고 일반적으로 나쁜 관행으로 간주 될 수있는 CSS 를 초과하게됩니다 . 이를 염두에두고 다음은 사이트 탐색을위한 일반적인 스타일의 예입니다. SCSS 구문 nav { ul { margin: 0; padding: 0; list-style: none; } li { display: inline-block; } a { display: block; padding: 6px 12px; text-decoration: none; .. 2020. 3. 30.