22.05.02 HTML html은 구조 css는 표현 HTML문서의 기본구조 > -태그는 로 구분 -태그는 소문자로 쓴다 등 단독태그는 여는 태그만 (닫는태그 필요x) 파일명 한글 안됨, 띄어쓰기 안됨(-._ 사용) 태그 => 요소 element 속성= 값
이 날 부터는 HTML과 CSS를 함께 사용하므로 두 언어가 구분 없이 병기 되어 있습니다.margin : 50px 10px 30px 20px ; 상 하 좌 우margin : 50px 10px 30px ; 상 좌우 하margin : 50px 10px ; 상하 좌우mar
얘를 실행하면<table> </table> 로 먼저 표 자리를 만든다 <tr></tr>은 행 <td>내용</td>은 행마다의 셀 만들 수 있다. <th>는 제목셀 여기 들어가는 내용은 셀의 중앙에 배치, 굵게 나옴테이블 사이즈
위가 navi 아래가 skin얘를 만들기위한 코드(float이용) 마크업은 navi만구조
float – 왼쪽이나 오른쪽에 배치하기 (clear로 해제(원치 않게 같이 끌려오는거 막아줌))clear : both – float 정렬 풀어줄 때 사용 (위에 있는 형제 요소들이 float이 되었을 때 아래에 있는 형제 요소는 원치 않아도 자꾸 끌려 올라가니까 풀어
가로는 text-align으로 맞춰주고 세로는 line-height와 padding값, height값을 조절해서 맞춘다.box sizing : content-box – width 속성 값을 콘텐츠 영역 너비값으로 사용(기본값)border-box – width 속성 값을
선형 그라데이션에는 브라우저 접두사 안붙여도 되지만, 원형 그라데이션에는 아직도 붙여야해 (-webkit- / -moz- / -o- )(그라데이션 지원 따라 코드 달아줘야해)background: repeating-linear-gradient(yellow, red 15p
z-index z축 (레이어 처럼 쌓을 수 있음) 무조건 position값 줘야 쓸 수 있음 border-spacing 셀 사이 여백 vertical-align속성 : 셀 안에 수직 정렬 ; 인라인 요소끼리의 상하단 맞출 수 있다. top/middle/bottom :
마진과 마진이 만날 때 마진 값이 큰 쪽으로 겹쳐짐상하 마진은 겹치면 collapsing 일어남. 마진과 마진이 맞물리면 큰 쪽만 들어감. 마진 합침, 수직으로만 작용! 좌우는 상관없음자식요소만 시각적인 요소를 가지고 있을 때 마진 상쇄됨인라인요소는 상하마진 안 들어가
@keyframes < 애니메이션이 바뀌는 지점@keyframes ani1(이름) {from{background-color: red; to{background-color: blue;}}animation 축약 속성으로 쓸 때 시간단위 들어간건 무조건 앞에 있는게 d
scss : css 전처리기> css의 부족한 점을 메워줄 수 있다css에서는 이렇게 일일이 경로를 적어줘야 했지만scss에서는 코드가 중첩되기 때문에 중복되는 코드가 적어진다.이렇게 {}를 이용하여 중첩할 수 있음.css에서는 로 썼어야 했지만 scss에서는이렇게
Grid (display : grid) Container(컨테이너)와 Item(아이템)이라는 두 가지 개념으로 구분된다. Container는 Items를 감싸는 부모 요소이며, 그 안에서 각 Item을 배치할 수 있다. Grid container 속성 (부모 속성)