HTML5 이전에 많은 웹페이지에서 태그에 id와 class를 이용하여 문서의 구역을 표시했다고 합니다. 와 같이 말이죠 이렇게 쓰이는 태그들이 많아지자 HTML5에서는 의미론적인 태그로 , , , 등의 태그들을 사용할 수 있게 됐습니다. 여기서 와 의미론적 태그들은 보이는 것에는 차이가 없지만 의미적으로 차이가 있습니다. 는 브라우저가 안에 담고있는 내용이 어떤 걸 담고 있는지 알지 못합니다. 하지만 의미론적 태그들을 이용하면 그 내용들이 어떤 것을 담고 있는지 의미를 브라우저가 분명하게 알 수 있도록 해줍니다. 를 쓰면 제목, 를 이용하면 네비게이션(목자) 등의 의미를 알 수 있도록 말이죠. 출처 : www.w3school.com 위 사진의 태그들은 HTML5에서 제공하는 의미론적 태그들입니다. 이번..
저번 포스팅에 와 을 썼었는데 개별적으로 다룰 가치에 있는 태그들이라 생각해서 따로 포스팅해봅니다 ㅎㅅㅎ 나중에 CSS를 이용하여 스타일을 지정할 때 개별 문단에 대해 일일이 속성을 지정하는 것보다 비슷한 유형의 문단에 그룹을 지정하여 한꺼번에 스타일을 지정하는게 아무래도 효과적일 것입니다. 이때, 비슷한 문단들을 묶어주는 태그가 바로 입니다. 사실, 는 다른 Element들을 감싸 하나의 그룹으로 만드는 역할을 할뿐 에 있는 기능은 없습니다. 하지만 는 HTML문서의 layout을 위해 사용하거나 HTML, CSS, JavaScript와의 분업 기능을 할 때 서로 통신할 수단으로서도 가치가 있는 태그입니다. 또한 그 자체에 의미가 없는 태그입니다. 문단의 특정 부분에 이름을 붙이는 역할로 와 비슷한 역..
블록과 인라인 HTML의 태그는 크게 블록요소와 인라인요소로 나눌 수 있습니다. 블록요소는 항상 한 줄을 독차지하게 됩니다. (단, CSS를 통해 스타일을 변경하지 않았다면) 그 자체로 하나의 문단이 되므로 항상 새로운 줄에서 시작되고 강제로 개행합니다. 대표적인 블록요소로는 1. 문단을 나타내는 태그 2. 제목을 나타내는 ~ 태그 3. 리스트를 표현하는 태그 4. 의미론적 태그인 태그 등이 있습니다. 인라인 요소는 문단의 한 부분을 차지하며 단어처럼 취급됩니다. 따라서 블록요소처럼 강제개행되지 않습니다. 문장사이에 끼어서 글자 형태로 배치되며 글자와 함께 나란히 배치됩니다. 대표적인 인라인 요소로는 1. 인라인요소를 나타내는 태그 2. 문서의 링크를 걸어주는 태그 등이 있습니다. 블록요소는 다른 블록요..
이미지 홀태그를 이용하여 이미지를 넣을 수 있습니다. 이미지 표현을 위해 꼭 필요한 속성이 있습니다. src 속성은 출력할 대상 이미지를 지정하며 생략할 수 없는 필수 속성입니다. 브라우저는 HTML 문서를 먼저 읽은 후 문서에 포함된 이미지를 다운받습니다. 별도의 분리된 파일이기 때문에 다운을 받은 후 표시하면 반응이 느리기 때문입니다. 이미지 크기를 강제 조정할 경우 품질이 떨어지고 네트워크 대역폭도 낭비되기 떄문에 width, height 속성보다는 스타일시트를 사용하는 것이나 아예 원본 파일의 크기를 바꾸는 것이 바람직합니다. 속성은 지정하는 것이 좋습니다. 네트워크 등의 문제로 이미지를 받지 못한 경우 문자열로 된 설명으로 어떤 그림이 있었는지 알려줍니다. 이미지에도 태그를 이용하여 링크를 걸 ..
