본문 바로가기

HTML63

2월 16일 (1) HTML - 공간 분할 * 원도우 라이브 서버 연결하기 127.0.0.1:5500 라이브 서버는 기본적으로 설치되어 있음. 라이브 서버 IP주소 도메인 주소 - 인터넷 진흥원에 등록해야 함(강남) 유료서비스 127.0.0.1 = localhost 특별한 IP 주소 대외적으로 사용할 수 없는 주소, 한 컴퓨터의 내부적으로만 사용하는 주소 localhost (도메인네임 ex) naver.com, daum.net과 같은 개념) 컴퓨터는 순번을 셀 때 0부터 센다. LAN 네트워크 주소 설정, 내부적으로 사용함 127.0.0.1 모두 같은 주소이나 자신의 컴퓨터 내부에서만 수행함. 다른 컴퓨터에서 내 작업 내용을 보려면 Live server가 필요하다. 라이브서버 설치방법(VSC) 1. 확장 - live server 설치 2. 내 I.. 2023. 2. 16.
HTML 태그 한 눈에 정리하기 1 문서 관련 태그 제목, ~까지 사용, 숫자가 커질수록 글자 크기는 작아진다. 텍스트 단락, 내용이 길면 웹 브라우저 창의 너비에 맞게 자동으로 줄이 바뀐다. 줄 바꿈, 텍스트 단락 중 원하는 위치에서 줄을 바꾼다. 내용 인용, 다른 내용보다 들여 쓰고 단락으로 표시한다. 중요한 텍스트를 굵게 표시, 스크린 리더기에서 강조해서 읽어준다. 볼드체, 화면 상 굵게 표시된다. 중요한 태그를 기울게 표시(문장), 스크린 리더기에서 강조해서 읽어준다. 이텔릭체, 화면 상 기울여서 표시된다.(마음속의 생각이나 용어) 내용을 편집할 때 추가한 내용을 표시한다. 내용을 편집할 때 삭제한 내용을 표시한다. 위 첨자 아래 첨자 목록 관련 태그 순서 있는 목록의 시작과 끝을 나타낸다. 순서 없는 목록의 시작과 끝을 나타낸다... 2023. 2. 16.
2월 15일 (2) HTML - 하이퍼 링크 하이퍼 링크 삽입하기 Hyper Text 초월문서, 문서의 범위를 뛰어넘는다. WWW(World Wide Web)에서 사용하는 문서의 형식인 Hyper Text를 구현한 태그 흔히, 링크(link)라고 한다. 사용 태그 ~ anchor(닻) 클릭이라는 이벤트를 통해서 페이즈를 이동하기 위해 사용 필수속성 href : 이동할 페이지를 지정하는 속성 이동할 페이지의 url(uri)를 작성한다. 같은 사이트 페이지로 이동할 때에는 http://을 생략해도 된다. re의 약자, 레퍼런스 : 참조하다. 범위로서의 차이 URL : Uniform Resource Locator 통합자원 위치정보 URI : Uniform Resource Indentifier 통합자원 식별자, 요즘에는 파라미터에 따라서 데이터가 많이 바.. 2023. 2. 15.
2월 15일 (1) HTML - 멀티미디어 추가 설명 p94 열 묶음 처리, 사전정의를 해주는 것이기 때문에 table 아래 작성 보조 적으로 사용하는 태그, 열과 매칭되어서 지정할 수 있다.(열의 개수만큼) 하나만 작성하면 첫 줄에만 적용된다. td(th)에 적용할 스타일을 미리 정의하여 적용 열의 개수만큼 태그를 사용하여 각 열별로 스타일을 정의할 수 있다. 정의할 스타일이 없는 경우 태그만 작성한다. 두 열 이상을 묶어서 스타일을 정의할 경우 span 속성을 사용한다. 네 줄이 있는 칸에서 세 번째만 적용하고 싶다면 만 쓰고 적용하고 싶은 곳에만 적용시키면 된다. (네번째는 아무 지정하지 않을 거면 작성하지 않아도 된다.) 에 적용할 수 있는 CSS border, background, width로 한정된다. 글자 가운데 정렬 td { tex.. 2023. 2. 15.
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.
2월 14일 (2) HTML - table 더미 이미지 참조 사이트 Home How To Set Custom Text You can specify text for your image by using a query string at the very end of the URL. So this URL… https://via.placeholder.com/728x90.png?text=Visit+WhoIsHostingThis.com+Buyers+Guide …produces this 728×90 sized image (ie, le placeholder.com 설계 시 위치를 잡을 때 크기나 공간을 사용할 수 있는 사이트 너비 x높이 단위 px, 색상 6자리 16진수로 지정 가능 16진수 : 0-9, a-f까지 사용, (ff= 255(10진수)) 계산기의 프로.. 2023. 2. 14.