100S00

float - 방식 float는 CSS의 속성 중 하나로, 요소를 왼쪽이나 오른쪽으로 떠서 배치하는 방식입니다. float를 이용하여 요소들을 배치하면, 다음 요소가 float된 요소 주위로 배치됩니다. 이 방식은 과거에 많이 사용되었으나, 요소의 높이가 자동으로 조절되지 않기 때문에 레이아웃이 깨질 위험이 있습니다. 아래의 이미지 코드 예시 입니다. 위 코드의 결과 레이아웃 입니다.

태그는 주제별 그룹의 콘텐츠 섹션을 설정합니다. 주제별로 제목 요소를 사용하는 것이 좋으며, 문서의 스타일링 요소나, 그룹화 요소가 아닙니다. 스타일 지정 목적이나 그룹화가 필요하다면 태그를 사용합니다. 주요 콘텐츠와 단독으로 콘텐츠를 표현하고 싶다면,요소를 사용하는 것이 적절합니다. 섹션과 관련된 태그(Section Related Tag) 태그는 문서의 주요 콘텐츠 영역을 설정합니다. 태그는 주제별 그룹의 콘텐츠 섹션을 설정합니다. 태그는 문서의 독립적인 컨텐츠 섹션을 설정합니다. 태그는 주요 콘텐츠의 보조적 컨텐츠 섹션을 설정합니다. 헤더 영역 주제별 영역 내용 독립된 주제 영역 내용 사이드 영역 내용 푸터 영역 섹션 레이아웃 예제

텍스트 관련요소 01. 텍스트 관련 요소 em태그는 강조하고 싶은 텍스트를 기울기로 표시한다 strong태그는 중요한 텍스트를 굵은체로 표시함 mark태그는 중요한 부분을 노란색으로 강조한다 b태그는 텍스트를 단순히 굵은체로 표시한다 small태그는 주의사항, 법적 제한, 저작권 등을 정의한다 sub태그는 아래첨자 텍스트를 정의한다 sup태그는 위첨자 텍스트를 정의한다 02. 목록 관련 요소 ol,li 태그 - 순서 목록 html css javascript jquery ul,li 태그 - 비순서 목록 html css javascript jquery dl,dt,dd 태그 - 설명 목록 html Hypertext Markup Language version html4.0. xhtml1.0, html5 css ..

시멘틱 마크업 & 논리적인 순서 마크업 시멘틱 마크업 시멘틱 마크업(Semantic)의 사전적 뜻은 "의미론적인" 정도로 해석할 수 있다. 이것은 마크업을 할 때 의미를 부여하는 태그로 보면 된다. 실제로 마크업을 할 때는 작업자마다 콘텐츠의 의미를 해석하는 차이가 조금 있을 수도 있지만 가급적 시멘틱하게 마크업을 하려고 노력하는 것도 중요하다. 시멘틱 마크업은 종종 POSH(Plain Old Semantic HTML)라고도 불리는데, 단어 그대로 평범하고 오래된 의미론적인 HTML이라는 뜻이다. 시멘틱은 즉, 기계(컴퓨터, 브라우저)가 잘 이해할 수 있도록 하는 것을 뜻한다. 애초에 프로그래밍 언어는 사람과 기계와의 정해진 약속이며 HTML 역시 마찬가지이다. 시멘틱 마크업은 적절한 HTML 요소를 올..

inline / block가 무엇일까? HTML에서 inline 구조는 주로 텍스트나 이미지 같은 작은 요소들을 나타내기 위해 사용됩니다. 예를 들어, 태그는 inline으로 적용되며, 특정 영역에 스타일을 적용하기 위해 사용될 수 있습니다. 태그도 inline으로 적용되며, 이미지를 문서 내에 삽입하는 데 사용됩니다. 다른 일반적인 inline 요소로는 , , , , , , 등이 있습니다. 이러한 요소는 텍스트 내에서 자연스럽게 흐르며, 다른 inline 요소와 함께 사용될 수 있습니다. 반면에, block 구조는 주로 문단이나 섹션 같은 큰 요소들을 나타내기 위해 사용됩니다. 예를 들어, 태그는 block으로 적용되며, 다른 요소들을 묶어서 스타일을 적용하기 위해 사용될 수 있습니다. 태그도 bloc..