본문 바로가기

Front-End/HTML15

HTML 태그 - Lists 공통적으로 사용하는 항목을 나타내는 태그 1. 순서목록 순서가 있는 목록 사용 시 기본값으로 숫자가 정해져 있다. type 속성을 사용하여 로마자 숫자, 영어로 바꾸어 줄 수 있다. 5가지 사용 가능 숫자, 대문자 영어, 소문자 영여, 대문자 로마숫자, 소문자 로마숫자 CSS 속성을 사용하여 type 속성을 바꿀 수 있다. style="list-style-type: 다양한 값;" 다양한 값에 원하는 값 넣기 / 아래 링크에서 확인가능 start 속성으로 시작 번호를 지정할 수 있다. W3Schools CSS list-style-type demonstration www.w3schools.com 예> 순서 목록 사용 예 HTML5 CSS3 JavaScript jQuery HTML5 CSS3 JavaScrip.. 2023. 2. 14.
HTML 태그- table 2 테이블 크기 조절 style속성에 사용하여 테이블, 행 또는 열의 크기를 지정한다. width 넓이 height 높이 표 만들 때 사용하면 좋은 태그 기본적으로 굵게 표시되고 중앙에 정렬되어 표시된다. 와 같이 사용하거나 의 자리에 대신 사용한다. 전체 테이블의 제목 역할을 한다. 어느 쪽에 써도 화면상에는 표 위쪽에 나타난다. 표 고정 태그 상단줄 고정 가운데 지정 범위 고정 하단바 고정 방 이름 대상 크기 가격 유채방 여성 도미토리 4인실 1인 20,0000원 동백방 동성 도미토리 가족1팀 천혜향방 - 2인실 바깥채 전체를 렌트합니다. 셀 합치는 태그 나 의 속성으로 쓰는 태그 colspan 열 합치기, 속성 값은 확장할 열 수를 나타낸다. rowspan 행 합치기, 속성 값은 확장할 행 수를 나타낸.. 2023. 2. 14.
HTML 태그 - table 표만들기 기본 태그 테이블 구성 행 만들기 테이블 셀의 내용 열 만들기 예시> 1 2 3 4 5 6 HTML의 테이블은 행과 열 내부의 테이블 셀로 구성된다. 셀의 내용에는 텍스트, 이미지, 목록, 링크, 기타 표 등 모든 종류의 HTML 요소가 포함될 수 있다. 기본적인 태그를 사용하여 완성하면 우리가 아는 일직선의 표가 아닌 예시처럼 이중으로 테두리가 둘러진 표가 나타난다. 표의 테두리는 border에 CSS의 속성을 사용해서 바꿀 수 있다. 표의 테두리 일직선으로 바꾸는 방법(CSS 사용) 속성 borther border: 1px solid black; 굵기, 선모양, 색상 순으로 작성 선 모양 속성값 solid 실선 dotted 점선 dashed 파선 색상 기본설정 검정색 속성 border-col.. 2023. 2. 11.
HTML - Favicon이란? 파비콘은 title 태그 옆에 있는 아이콘을 말한다. 아래에 빨간색 박스가 바로 파비콘이다. 아래 사이트에서 나만의 파비콘을 직접 만들어 다운 받을 수 있다. favicon.ico Generator Preview Favicon in original size: www.favicon.cc 파비콘 이미지의 일반적인 이름은 "favicon.ico"이다. 웹사이트에 파비콘을 추가하려면 파비콘 이미지를 웹 서버의 루트 디렉터리에 저장하거나 이미지라는 루트 디렉터리에 폴더를 만들고 이 폴더에 파비콘 이미지를 저장해야 한다. 2023. 2. 8.
HTML 태그 - 서식에 사용되는 태그들 html에서 코딩을 작성할 때 아무리 엔터나 스페이스를 눌러서 공간을 띄어도 실제 보이는 화면에서는 줄 바꿈이 일어나지 않는다. 따라서 서식을 꾸미는 태그들이 따로 존재한다. 서식은 문서를 꾸미는 형식을 말하는데, 글자의 크기, 글자의 색, 글자의 정렬을 조절한다. 서식에 사용되는 태그들 제목 h1 제목 h2 제목 h3 제목 h4 제목 h5 제목 h6 제목을 나타내는 태그 태그 안에 글씨를 굵게 보이는 속성이 포함되어 있다. 숫자가 작을수록 화면에 크게 나타난다. 한 줄 띄어쓰기 태그, 닫는 태그가 없다. 가로줄 태그, 닫는 태그가 없다. 문단 태그로, 문단 사이에 줄 바꿈이 일어난다. 굵은 텍스트 중요 텍스트, 매우 중요한 텍스트를 정의 기울임 꼴 텍스트 기울임꼴 텍스트, 강조 텍스트를 정의 표시된 텍.. 2023. 2. 6.
HTML 요소 - inline-element, block-element HTML의 모든 요소에는 요소 유형에 따라 기본 표시 값이 있다. 표시 값에는 inline-element, block-element 두 가지가 있다. 이 표시값에 따라서 사용할 수 있는 속성 태그가 달라진다. inline-element 인라인 요소는 새 줄에서 시작하지 않는다. 인라인 요소는 필요한 만큼의 너비만 차지한다. 대표적으로 사용되는 요소는 단락의 내부에서 사용되는 요소 요소는 텍스트의 일부 또는 문서의 일부를 표시하는 데 사용 참고: 인라인 요소는 블록 수준 요소를 포함할 수 없다! 예시> 공간크기로 보는 인라인요소 span 태그는 내부적인 요소로 Hello World 필요한 너비만큼만 작동한다. span 요소는 인라인 요소로, 새 선에서 시작하지 않고 필요한 만큼의 너비만 차지한다.(빨간박스.. 2023. 2. 5.