본문 바로가기

HTML63

2월 14일 (1) HTML - 목록 요소의 형식 내용 [ ] 안의 내용은 생략가능하다. 쓸수도 있고 안 쓸 수도 있다. 공통 태그(List Item) : 항목을 나타낸다. 계층 구조를 가진다. 공통속성 width : 요소의 가로 길이를 지정하는 속성 단위 px 픽셀 한 점의 크기 (내장된 고정된 크기) % 백분율(기준 : 브라우저 창의 내부 화면 크기에 따라서 길이가 달라진다.) 세로보다 가로를 더 중요하여 여긴다. UX적 측면에서 보조적인 측면이 더 많이 들어가 있다. 비율을 사용하는 형태로 처리 세로를 먼저 지정하고 가로길이를 지정 태그 : 수평선 표현 주요 속성 : width 가로길이 지정 size 두께 지정(1-2px 차이 없음, 3px 정도만 사용, 그 이상을 잘 사용하지 않는다.) 목록태그 : List 화면에 목록 형태로 텍스트.. 2023. 2. 14.
HTML 태그- table 2 테이블 크기 조절 style속성에 사용하여 테이블, 행 또는 열의 크기를 지정한다. width 넓이 height 높이 표 만들 때 사용하면 좋은 태그 기본적으로 굵게 표시되고 중앙에 정렬되어 표시된다. 와 같이 사용하거나 의 자리에 대신 사용한다. 전체 테이블의 제목 역할을 한다. 어느 쪽에 써도 화면상에는 표 위쪽에 나타난다. 표 고정 태그 상단줄 고정 가운데 지정 범위 고정 하단바 고정 방 이름 대상 크기 가격 유채방 여성 도미토리 4인실 1인 20,0000원 동백방 동성 도미토리 가족1팀 천혜향방 - 2인실 바깥채 전체를 렌트합니다. 셀 합치는 태그 나 의 속성으로 쓰는 태그 colspan 열 합치기, 속성 값은 확장할 열 수를 나타낸다. rowspan 행 합치기, 속성 값은 확장할 행 수를 나타낸.. 2023. 2. 14.
2월 13일 (1) HTML - 웹 개발 시작하기 1. 웹 개발 웹 브라우저 화면에 보이는 겉모습을 만드는 것이 전부가 아니다. 웹 사이트는 사용자에게 제공할 기능, 서비스까지 모두 담아야 한다. 서버 vs 클라이언트 프런트엔트 개발 vs 백엔드 개발 기본페이지, 웰컴파이, 웰컴페이지 - 처음 웹 사이트에 들어갔을 때 웹페이지의 상단 제어하는 부분(주소창, 제목 등) 서비스를 제공하는 부분(화면 부분) - 프런트엔드 엔드 포인트 ------------ 엔드 포인트 기본영역 HTML, CSS, JS HTML - 웹 문서의 뼈대 CSS - 웹 문서를 꾸밈 JS - 사용자 동작에 반응 과거 : 정적인 페이지가 주, 변하지 않음 현재 : 동적인 페이지, 뉴스 등 변화함 배울 기술 제이쿼리 스프링 2. 웹 개발 환경 만들기 웹 브라우저 크롬, 엣지, 파이어폭스,.. 2023. 2. 13.
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.

티스토리툴바