Front-End
-
SCSSFront-End 2019. 6. 13. 18:24
SCSS의 기본 사용 방법 {}안에 자식요소 태그(class, ID등)를 쓰면 자동으로 부모요소에서 인식해 준다. // index.html 배고파 // style.SCSS div { background: red; width: 400px; height: 400px; p { color: white; font-weight: bold; text-align: center; } } 출력: // style.CSS div {background: red; width: 400px; height: 400px;} div p {color: white; font-weight: bold; text-align: center;}
-
html5 요소 + IE핵Front-End 2013. 6. 13. 13:06
HTML5 기본 레이아웃 구성 HTML5 TEST Think Slowly GlobalNav GlobalNav GlobalNav GlobalNav GlobalNav h2--テキスト-- text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text t..
-
실전에서 유용하게 쓰이는 CSS 코드 -2-Front-End 2013. 6. 6. 15:57
/*여백조절*/body{ margin:0; padding:0} /*여백 설정을 0으로 하려면 마진과 패딩 둘다 0으로 지정*/body { margin:20px; padding:0; background-color:silver;} /*중앙 정렬*/#body{ margin:0 auto;}body{ margin:0 auto; text-align:center;}/*IE 6의 중앙정렬을 위해선 text-align 을지정*/ /* 글로벌 네비게이션 */ul#globalnavi{ margin:0; padding:0;}ul#globalnavi li{ display:inline; list-style-type:none; margin:0; padding:5px; font-size:80%;}ul#globalnavi a{ fon..
-
실전에서 유용하게 쓰이는 CSS 코드 -1-Front-End 2013. 6. 6. 15:50
body {background-image: url(img.gif);background-repeat: repeat-y; /* 바탕화면 배경 줄서는 방법* repeat-x (가로) repeat(반복) no repeat(1번만표시)*/background-position: center; /* 백그라운드 위치선정*/background-attachment: fixed; /*백그라운드 스크롤 방지(배경은 멈추고 텍스트만 움직이게 하고 싶을때*/} /* 텍스트 area 룰오버 색깔 변경*/textarea.example {scrollbar-base-color: transparent; scrollbar-arrow-color: transparent;} /* 전체 룰오버 세세설정*/body {scrollbar-face-col..