Study Record

글꼴 관련 스타일텍스트 스타일 중 글자의 모양새 즉, 크기와 굵기와 이텔릭체 여부 등 글꼴 속성을 알아본다.   font-family 속성 - 글꼴 지정하기웹 문서에서 사용할 글꼴은 font-family 속성으로 지정할 수 있다. p { font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;}이미 설치된 글꼴이 아닌 경우, 브라우저의 기본 값이 나타나 각각 다른 글꼴로 표시된다. 따라서 웹 문서에서 글꼴을 지정할 때는 한가지 글꼴만 지정하기도 하지만 지정한 글꼴이 없을 경우를 위해 두번째, 세번째 글꼴까지 지정해야 한다. 두 개 이상의 글꼴 이름을 지정할 때는 글꼴 이름과 이름 사이의 쉼표(,)로 구분한다. 시스템에 설치되..

스타일(style)이란?웹 에서의 스타일(style)은 미리 약속한 스타일 속성을 입력해 웹을 디자인하는 것을 말한다. 한 문서에서 반복해 쓰이는 스타일들을 모아 놓은 것을 '스타일 시트'라고 부른다. HTML 로 스타일 작업을 하지 않고 따로 스타일을 사용하는 이유로는 다음과 같다.웹 문서의 내용과 상관없이 디자인만 바꿀 수 있다.다양한 기기에 맞게 탄력적으로 바뀌는 문서를 만들 수 있다.   스타일 형식선택자 { 속성: 값; }/* 예시 */h2 { font-soze: 20px; }p { font-size: 20px; color: orange;}   스타일과 스타일 시트웹 문서 안에는 여러 개의 스타일 규칙이 사용되는 경우가 많은데 이런 스타일 규칙들을 한눈에 확인하고 필요할 때마다 수정하..

태그로 버튼 넣기 태그로 버튼(submit, reset 등)을 만들었던 것과 비슷하게 태그를 이용해도 폼을 전송하거나 리셋(reset)하기 위한 버튼을 삽입할 수 있다. 다음 예시에서 input 태그의 submit 유형과 button 태그의 submit 유형은 같은 기능을 한다. 마찬가지로 reset 유형도 같은 기능을 한다. 이름 나이 제출하기 리셋하기 input 태그를 사용했을 때와 차이점이라면 button 태그는 화면 낭독기에서 이 부분에는 버튼이 있다는 것을 알고 정확히 전달할 수 있다. 버튼 태그 안에 이미지 태그가 포함된 예시) 리셋하기   태그 - 계산 결과입력하는 값이 계산 결과라는 것을 브라우저에게 알려준다. 브라우저 화면에 다르게 표시되는 ..

드롭다운 목록 만들기(, , )여러 옵션 중에서 선택하도록 하고 싶을 때 드롭다운 목록을 사용한다. 드롭다운 목록은 태그와 태그를 이용해 표시한다.  속성size : 화면에 표시될 드롭다운 메뉴의 항목 개수를 지정한다(크롬의 경우 size에서 지정한 개수보다 하나 더 많은 옵션이 표시된다)multiple : 여러 개의 옵션이 함께 표시도면 Ctrl 키를 누른 상태로 드롭다운 메뉴에 있는 여러 항목을 선택할 수 있다. 속성value : 옵션을 선택했을 때 서버로 넘겨질 값을 지정한다.selected : 화면에 표시될 때 기본으로 선택되어 있는 옵션을 지정한다.  간단한 예시) 사과 레몬 딸기  multiple 속성으로 여러 항목을 선택할 때는 ctrl 키를 누른 채로 선택이 가능하다 ..

태그웹에서 사용자가 입력할 부분은 주로 태그를 이용해 넣는다. 폼에서 사용자 입력을 받기 위해 사용하는 태그이다.    태그로 입력 항목 만들기웹에서의 폼은 크게 사용자가 입력하는 부분과 입력한 내용을 서버로 보내는 버튼 부분으로 나눌 수 있다. input 태그로 만들 수 있는 폼 요소가 상당히 많은데 그것은 type 속성을 이용해 구분한다.  + id 속성 사용하기여러번 사용된 폼 요소를 구분하기 위해 사용하는 것이 id속성이다.   여러가지 type 유형 살펴보기  히든 필드 만들기(type="hidden")히든 필드는 화면상의 폼에는 보이지 않지만 사용자가 입력을 마치고 폼을 서버로 전송할 때 서버로 함께 전송되는 요소이다. 보통 사용자에게 굳이 보여 줄 필요가 없지만 관리자가 알아야 하는 것을 ..

폼(form)웹 폼은 특정 항목에 사용자가 뭔가를 입력하는 형태로 우리가 익숙하게 사용하는 로그인 창이 바로 웹 폼을 이용한 대표적인 사례이다.    태그로 폼 만들기 태그는 폼을 만드는 가장 기본적인 태그로 태그 안에 여러가지 폼 관련 태그를 넣는다.method : 사용자가 입력한 내용들을 서버 쪽 프로그램으로 어떻게 넘겨줄지 지정한다. - get : 주소 표시줄에 사용자가 입력한 내용이 그대로 드러난다. - post : 입력 길이 제한을 받지 않고 사용자가 입력한 내용이 드러나지 않는다.name : 폼의 이름을 지전한다.action : 태그 안의 내용들을 처리해 줄 서버 상의 프로그램을 지정한다.target : 태그에서 지정한 스크립트 파일을 현재 창이 아닌 다른 위치에서 열도록 지정한..

순서 없는 목록 만들기 , 태그순서가 필요하지 않는 목록을 만들 때는 ul 태그를 사용하고 각 항목으로 li 태그를 사용한다. 일반 전화 이메일 휴대 전화  순서 있는 목록 만들기 , 태그항목을 나열하되 순서가 필요한 목록을 만들 때는 태그 대신 태그로 사용한다. 여러 속성들과 함께 사용하여 목록의 숫자 표기 방법이나 시작하는 숫자 등을 바꿀 수 있다.  한라 수목원 산방산 광교산 설악산 해수욕장 한라 수목원 산방산 광교산 설악산 해수욕장   태그 생략과 목록 중첩 태그를 생략해도 태그가 다음에 오는 태그를 만나면 자동으로 그 전에 태그가 있는 것처럼 인식한다. 한라 수목원 산방산 광교산 설악산 해..

웹 호스팅 서비스HTML 로 웹 사이트를 만들고 그 내용을 다른 사람이 볼 수 있도록 하려면 HTML로 만든 웹 문서를 모두 서버 컴퓨터로 옮겨야 한다. 개인은 웹 서버를 마련하기 어렵기 때문에 서버의 일부 공간을 매달 또는 몇 년마다 일정 금액을 내고 사용하는 서비스를 이용한다. 이것을 서버 호스팅 서비스 또는 웹 호스팅 서비스라고 한다.   무료 호스팅 서비스 닷홈웹 문서들을 업로드할 수 있는 무료 쉡 서버 공간 중 하나로 닷홈의 호스팅 서비스를 이용할 수 있습니다. 닷홈은 1년 간 무료로 사용할 수 있으며 1년이 지나면 연장 신청을 해야 무료로 계속 사용할 수 있다.  https://www.dothome.co.kr/ 무료홈페이지 | 무료호스팅 | 닷홈닷홈은 도메인, 무료호스팅, 무료홈페이지, 웹호스..