728x90 반응형 SMALL IT41 HTML5 - 리스트(목록) 태그 목록들을 나열하고 싶을 때 쓰는 리스트 태그에 대해 알아보겠습니다. 리스트 태그에는 3가지 종류가 있습니다. ① ol 태그 순서가 있는 목록(리스트) ② ul 태그 순서가 없는 목록(리스트) ③ dl 태그 설명 리스트 위의 리스트 태그는 아래와 같은 목록 요소(자식 요소)를 가집니다.태그, 태그 ① li 태그 목록 요소 태그 ① dt 태그 용어 ② dd 태그 용어에 대한 설명문(들여쓰기) 합쳐서 정리하면 아래와 같습니다. ① ol 태그 + li 태그순서가 있는 목록(리스트) ② ul 태그 + li 태그순서가 없는 목록(리스트) ③ dl 태그 + dt 태그 + dd 태그설명 리스트 #1 태그와 태그표에서 봤다시피 태그는 순서가 있는 리스트 태그입니다. 태그 안에는 무조건 목록 요소인 태그가 들어갑니다. 표.. 2020. 11. 26. HTML&CSS-위치 변경하기 HTML5, CSS3을 이용해 요소들의 위치를 지정(변경)해보겠습니다. 앞전 태그에 대한 글에 위치 지정하는 부분이 나오긴 했지만 제대로 설명하지 않고 넘어갔는데 이번에 제대로 알아보겠습니다. 위치를 지정하기 위해서는 먼저 CSS의 position 값을 줘야 합니다. 그 전에 position 속성의 종류(키워드)에 대해 설명하겠습니다. ① relative 상대값 / 위치 설정 가능하고 자리를 차지함 ② absolute 절대값 / 절대 위치 설정 가능 ③ fixed 고정값 / 화면 기준으로 위치 설정 가능 ④ sticky 스크롤을 내리면 위치 설정 ⑤ static 기본값 / top, left, bottom, right 지정 안됨 ⑥ inherit - ⑦ initial - ⑧ revert - ⑨ unset .. 2020. 11. 25. HTML-<a>태그 html 태그에 대해 알아보겠습니다.태그는 링크를 걸 때 사용합니다.속성, 주소 체계, 종류에 대해 알아보겠습니다. 속성 #1 href 속성링크를 걸어 줄 주소를 넣는 기본속성입니다.태그 안에 href 속성을 넣어주면 됩니다.태그 안 글자를 누르면 티스토리 홈페이지로 가도록 해보겠습니다. 표시방법 티스토리 실제 웹페이지'티스토리' 글자 안에 링크를 걸어주었습니다.글자에 마우스를 갖다 대면 커서가 손모양(포인터)으로 바뀌는 것을 확인할 수 있습니다. 조금 더 보기 좋게 CSS를 사용해 꾸며보았습니다. 글자를 누르면 티스토리 홈페이지로 이동하게 됩니다.그런데 티스토리로 이동하면서 그 전의 페이지가 없어졌습니다.좀 더 정확히 말하면 뒤로 가기 버튼을 눌러야 원래 페이지로 돌아가는 것이죠. 그렇다면 링크페이지가.. 2020. 11. 25. HTML-글자 태그 이번엔 HTML 글자 태그에 대해 알아보겠습니다.참고로 Sublime Text3를 기준으로 설명합니다.에 태그를 하나씩 넣으면서 설명하겠습니다. #1 굵은 글자첫번째, bold의 약자로 'b'태그를 사용하시면 됩니다.b를 입력하고 Tab키를 누르면 '' 태그가 자동으로 불러와집니다. 두번째, 'strong'태그를 사용합니다.마찬가지로 strong을 입력 후 Tab키를 누르면 ''태그가 불러와집니다. 표시방법 굵은 글자-b태그 >굵은 글자-strong태그첫 번째 포스팅에서 설명드린 태그도 함께 사용했습니다. 실제 웹페이지 #2 글자 기울임 / 강조체첫번째, 기울인 글자는 italic의 약자인 i를 활용해 태그를 사용합니다. 두번째, 강조체도 이태릭체와 거의 똑같습니다.강조체는 태그를 사용합니다. 표시방법 .. 2020. 11. 25. HTML 태그 보호되어 있는 글 입니다. 2020. 9. 29. 이전 1 ··· 4 5 6 7 다음 이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다. 728x90 반응형 LIST