CSS강좌

Property 

https://www.cmsfactory.net/node/11041

animation-delay로 애니메이션이 시작하는 시간을 연기

animation-direction은 애니메이션을 실행할 때 @keyframes에서 정한 순서로 할지, 반대 순서로 할지를 정합니다

normal : @keyframes에서 정한 순서로 진행합니다.

reverse : 반대 순서로 진행합니다.

alternate : 홀수번째 반복에서는 CSS에서 정한 순서로, 짝수번째 반복에서는 반대 순서로 진행합니다.

alternate-reverse : 짝수번째 반복에서는 CSS에서 정한 순서로, 홀수번째 반복에서는 반대 순서로 진행합니다.

initial : 기본값으로 설정합니다.

inherit : 부모 요소의 속성값을 상속받습니다.

opacity로 요소의 투명도를 정할 수 있습니다.

position은 요소의 위치를 정할 때 어디를 기준으로 할지 정하는 속성

속성값은 static, absolute, fixed, relative가 있으며, 기본값은 static

position을 static으로 설정하면 top, right, bottom, left를 설정해도 적용되지 않음.

position: absolute; 문서의 꼭짓점을 기준으로 위치

position: fixed; 웹브라우저의 꼭짓점을 기준으로 위치

position: relative; static일 때의 위치를 기준으로 위치를 계산합니다. 주의할 점은 원래의 자리가 다른 요소로 채워지지 않고 공백으로 남는다는 것입니다.

스마트메이커 모바일

html{overflow-y:scroll;-webkit-text-size-adjust:none;}

body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,form,fieldset,legend,input,button,select,textarea{margin:0;padding:0;}

body{font-size:13px;color:#727272;line-height:18px;font-family:Dotum,sans-serif;}

a{text-decoration:none;border:none;}

fieldset,img{border:none;}

li{list-style:none;}

address{font-style:normal;}

input,textarea,select{-webkit-appearance:none;-webkit-border-radius:0;}

button{border:none;outline:none;cursor:pointer;background:none;}

default.css

@charset "utf-8";

/*font-face*/

@font-face {

font-family:'Hyundai_M'; font-style:normal; 

src:url(../font/HyundaiSansHeadKRMedium.eot);

src:url(../font/HyundaiSansHeadKRMedium.eot?#iefix) format('embedded-opentype'),

url(../font/HyundaiSansHeadKRMedium.woff) format('woff'),

url(../font/HyundaiSansHeadKRMedium.ttf) format('truetype');

}

@font-face {

font-family:'Hyundai_B'; font-style:normal; 

src:url(../font/HyundaiSansHeadKRBold.eot);

src:url(../font/HyundaiSansHeadKRBold.eot?#iefix) format('embedded-opentype'),

url(../font/HyundaiSansHeadKRBold.woff) format('woff'),

url(../font/HyundaiSansHeadKRBold.ttf) format('truetype');

}

@font-face {

font-family:'Hyundai_R'; font-style:normal; 

src:url(../font/HyundaiSansHeadKRRegular.eot);

src:url(../font/HyundaiSansHeadKRRegular.eot?#iefix) format('embedded-opentype'),

url(../font/HyundaiSansHeadKRRegular.woff) format('woff'),

url(../font/HyundaiSansHeadKRRegular.ttf) format('truetype');

}

/*default*/

html,body{width:100%;height:100%}

body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,form,fieldset,legend,input,button,select,textarea{margin:0;padding:0;}

body{font-size:13px;color:#000;line-height:18px;font-family:'Hyundai_M',Dotum,sans-serif;}

a{font-size:13px;color:#000;text-decoration:none;border:none;}

fieldset,img{border:none;}

li{list-style:none;}

address{font-style:normal;}

button{overflow:hidden;vertical-align:middle;cursor:pointer;border:none;background:transparent;}

button::-moz-focus-inner{padding:0;border:none;}

label{cursor:pointer;}

table{border-collapse:collapse;border-spacing:0}

input, textarea{-webkit-appearance:none;-webkit-border-radius:0;}

button, input, textarea, select{font-family: 'Hyundai_M',Dotum, sans-serif; vertical-align: middle;}

img{vertical-align:top}

/*Option*/

a, button, img, strong, span{display: inline-block;}

strong, h1, h2{font-weight: normal;}

strong, h1, h2, h3, p, span{line-height: 1;}

*{-webkit-text-size-adjust:none}

button.style1{background-color: #0d3565; color: #fff;}

.clearfix:after{content: ""; display: block; clear: both;}

.blind{overflow:hidden;visibility:hidden;width:0;height:0;font-size:0;line-height:0;text-indent:-9999px}

.bold{font-weight: bold;}

/*font drag color*/

::selection { background-color: #79add6; color: #fff;}

::-moz-selection { background-color: #79add6; color: #fff;}

/*미디어쿼리*/

@media screen and (max-width:1000px){}