본문 바로가기

웹코딩 배우기/· 태그 사전47

HTML 태그 사전 태그 이름을 클릭하면 상세 설명 페이지로 이동합니다. 상세 페이지가 있는 태그는 회색배경 + 빨간 글씨. 주로 티스토리 스킨 편집에 사용하는 태그만 정리합니다. 태그 이름 속성 설명 URL 링크 생략된 글자나 머리글자를 표시 생략된 글자나 약어를 표시 페이지의 연락처 정보를 정의 애플랫 요소를 정의 이미지 맵의 영역을 정의 문서내에 독립적인 컨텐츠를 정의 문서내에 사이드 컨텐츠를 정의 오디오 파일을 정의 글씨 두껍게 모든 URL의 기본이 되는 기본 URL을 설정 문서의 기본 폰트, 사이즈, 종류를 설정 텍스트의 출력 방향을 브라우저가 판단해 표현 텍스트의 방향을 설정 텍스트 크기를 크게 긴 문장의 인용문을 정의 텍스트를 깜박이게 문서 본문에 해당하는 콘텐츠를 포함하는 영역 텍스트를 줄바꿈 할 때 사용 버.. 2019. 9. 17.
CSS 태그 사전 태그 이름을 클릭하면 상세 설명 페이지로 이동합니다. 상세 페이지가 있는 태그는 회색배경 + 빨간 글씨. 주로 티스토리 스킨 편집에 사용하는 태그만 정리합니다. 태그 이름 속성 설명 align-content 콘텐츠의 상하 관계 정렬 상태를 정의 align-items 콘텐츠 내부의 정렬 상태를 정의 align-self 콘텐츠의 정렬 상태를 정의 all 요소의 속성을 초기화 또는 상속을 설정 animation 움직임을 표현 animation-delay 요소가 로드된 후 애니메이션이 시작될 때 까지의 시간 animation-direction 애니메이션 움직임 방향을 설정 animation-duration 애니메이션 움직임 시간을 설정 animation-fill-mode 애니메이션이 끝난 후의 상태를 설정 an.. 2019. 9. 17.
CSS 태그 : z-index z-index 위치가 겹칠 경우 순서를 정의 z-index 값이 클수록 상위에 표시 됩니다. 음수도 사용 가능하고 99999까지 사용할 수 있습니다. 그 이상의 숫자도 작동합니다. 2019. 9. 17.
CSS 태그 : width width 요소의 가로 값을 정의 width 값은 px, %로 정합니다. height와 방법이 동일하다고 보면 됩니다. 2019. 9. 17.
CSS 태그 : top top 요소의 위쪽 속성을 설정 top은 위에서 얼마의 공간을 두고 배치 할지 설정합니다. left, right, bottom 값 설정 방법과 동일합니다. 2019. 9. 17.
CSS 태그 : text-align text-align 텍스트 정렬 방식을 설정 left : 왼쪽 정렬 right : 오른쪽 정렬 center : 가운데 정렬 justify : 양쪽 정렬 inherit : 상위 요소에 상속 받는다. 2019. 9. 17.
CSS 태그 : right right 요소의 오른쪽 속성을 설정 right 값은 px, %로 표현합니다. 오른쪽에서 얼마의 공간을 두고 배치 할지를 정합니다. 2019. 9. 17.
CSS 태그 : position position 요소의 위치를 설정 static : 기본값. top, right, bottom, left로 값을 지정 할 수 없습니다. absolute : 절대적 위치 값. top, right, bottom, left로 위치 값을 지정합니다. relative : 상대적 위치 및 기준점으로 설정. top, right, bottom, left로 위치 값을 지정합니다. fixed : 위치를 고정. 스크롤해도 움직이지 않는다. top, right, bottom, left로 위치 값을 지정합니다. * 예시 이미지로는 설명을 다 할 수 없는 부분이 있습니다. 많이 연습해보세요. 2019. 9. 17.
CSS 태그 : padding padding 요소의 안쪽 여백을 설정 ▲ 녹색 영역이 padding 입니다. 값은 em, px, % 를 쓸 수 있고 음수 값을 가질 수 있습니다. padding은 padding-top, padding-right, padding-bottom, padding-left 모든 값을 가지고 있습니다. padding: 10px; /* 상-우-하-좌 */ padding: 10px 20px; /* 상하-좌우 */ padding: 10px 20px 30px; /* 상-좌우-하 */ padding도 margin 거의 99% 동일하게 속성을 설정합니다. 2019. 9. 17.
CSS 태그 : outline outline 요소의 아웃라인의 색, 스타일, 굵기를 정의 outline-color : 색outline-style : 라인 종류outline-width : 굵기outline 태그에는 위 3가지 속성이 있습니다. 그러나 각각 태그를 쓸 필요 없이 다음 처럼 사용하면 됩니다. outline: 8px inset #ccc; >> outline : 라인굵기 라인종류 색; outline 태그는 border와 쓰는 방법이 같음을 알 수 있습니다. 2019. 9. 17.
CSS 태그 : margin margin 요소의 바같쪽 여백을 설정 margin은 margin-top, margin-right, margin-bottom, margin-left 모든 값을 가지고 있습니다. {margin: 50px;} 상-우-하-좌 {margin: 50px 60px;} 상하-좌우 {margin: 50px 60px 30px;} 상-좌우-하 {margin: 0 auto;} 상하-중앙정렬 위 값의 순서는 기억하기 어려우니 그냥 {margin: 0 0 0 0;} 상우하좌 하나만 기억하면 됩니다. 값은 px, %, auto를 쓸 수 있습니다. ▲ 마진 값을 가진 박스의 상하 마진 값은 겹칩니다. 상하 마진 값이 큰쪽으로겹치게 됩니다. 마진은 음수, 양수 값을 가질 수 있고 합산한 마진 값을 적용합니다. ▲ float으로 정렬.. 2019. 9. 17.