본문 바로가기

HTML515

w3스쿨즈 HTML(7) - class, id Class 기본 사용법은 설명이나 예제가 필요없이 보고도 이해 가능한거라 활용법을 소개합니다. ※note : class 속성은 모든 HTML 태그에서 사용할 수 있다. ※note : class 는 대소문자를 구분한다. 인라인 요소에서 클래스 속성 사용 span.note { font-size: 120%; color: red; } My Important Heading This is some important text. 특정 클래스를 가진 요소 선택 CSS에서 특정 클래스를 가진 요소를 선택하려면 마침표 (.) 문자와 클래스 이름을 작성하세요. 멀티 클래스(한번에 2개 이상의 클래스 쓰기) HTML 요소는 둘 이상의 클래스 이름을 가질 수 있으며 각 클래스 이름은 공백으로 구분해야합니다. London // ... 2022. 3. 29.
w3스쿨즈 HTML(7) - block, inline 모든 HTML 태그에는 태그 유형에 따라 기본 표시 값이 있습니다. 기본 표시값은 block 과 inline입니다. 블록 블록은 항상 새 줄에서 시작하여 사용 가능한 전체 너비를 차지한다. (가능한한 왼쪽과 오른쪽으로 뻗는다.) 대표적으로 가 있다 는 주로 다른 HTML을 감싸는 container로 사용된다. 태그는 필수 속성은 없지만 주로 style, class, id 속성이 쓰인다. 는 CSS와 함께 사용하면 요소를 사용하여 콘텐츠 블록 스타일을 지정할 수 있다. 인라인 인라인 요소는 새 줄에서 시작되지 않으며 필요한만큼만 폭을 차지한다. 대표적으로 이 있다. 은 주로 some text의 container로 사용된다. 태그는 필구 속성은 없지만 주로 style, class, id 속성이 쓰인다. 는 .. 2022. 3. 29.
w3스쿨즈 HTML(6) - 리스트[list] Unordered List // 순서기호가 존재하지않음 Coffee Tea Milk CSS list-style-type 속성은 목록 항목 마커의 스타일을 정의하는 데 사용됩니다. disc : 기본속성으로 검은색 꽉찬 동그라미 circle : 빈속 동그라미 square : 검은색 네모 none : 아무것도 표시되지않음 Coffee Tea Milk list image ul { list-style-image: url('sqpurple.gif'); } position list ul.a { list-style-position: outside; } ul.b { list-style-position: inside; } Remove Default 셋팅 ul { list-style-type: none; margin: 0;.. 2022. 3. 29.
w3스쿨즈 HTML(6) - 테이블[table] HTML을 하다보면 가장 많이 사용되는 태그가 바로 테이블이다. 테이블은 표를 만들어주는 HTML 태그인데, 지금은 잘 사용하지는 않지만 과거에 웹사이트의 레이아웃을 배치할 때도 많이 사용되었던 태그이다. 테이블 속성 테이블을 만드는 태그 테이블의 헤더 테이블의 행 테이블의 열 Company Contact Country Alfreds Futterkiste Maria Anders Germany Centro comercial Moctezuma Francisco Chang Mexico 테이블 디자인 속성 border 테이블의 테두리 bordercolor 테이블의 테두리 색상 width 테이블 가로 크기 height 테이블 세로 크기 align 정렬 bgcolor 배경색 colspan 가로 합병(열 합병) ro.. 2022. 3. 29.
w3스쿨즈 HTML(5) - 이미지[image] 이미지 image 크기조절의 기본단위는 px image 태그는 닫히는 구문이 없습니다. alt속성은 이미지를 볼 수 없는 경우 대체 텍스트를 제공합니다. (화면판독기를 사용하는경우) 이미지링크의 경우 서버에 있는 이미지를 이용하거나 문서파일을 이용할 수 있습니다. HTML은 GIF(애니메이션)파일을 허용합니다. 이미지에 링크을 걸 수 있습니다. alt속성은 반드시 정의해주어야합니다. 그렇지 않으면 웹페이지의 유효성이 올바르게 검사되지않습니다. 항상 이미지의 너비와 높이를 지정하십시오. 너비와 높이를 지정하지 않으면 이미지가로드되는 동안 페이지가 깜박일 수 있습니다. 일반적으로 style속성을 이용해 너비와 높이를 지정해주는 것이 좋습니다. 왜냐햐면 스타일 시트가 이미지의 크기를 변경하지 못하도록 예방합니.. 2022. 3. 24.