코드그라데이션

font-family 글꼴 지정 속성 텍스트 사용 요소에서 주로 사용한다. 기본형 font-family: "글꼴 이름" | 대체글꼴이름, 대체글꼴이름 기본형 기호 이해하기 font-size 글자 크기의 단위는 px（픽셀）이나 pt（포인트） 등으로 지정할 수 있고 백분율을 사용 # 글자 크기 설정 방식 1) 키워드 사용 2) 단위 사용 3) 백분율 사용 부모의 글꼴 크기가 단위로 설정되어 있어야 한다. font-style : 이텔릭체로 글자 표현 이텔릭체로 글자를 바꾸는 속성값은 italic과 oblique 가 있는데, 웹에서는 주로 italic을 사용한다. italic은 기울어진 글꼴이 처음부터 디자인되어 있는 반면 oblique는 원래 글꼴을 단지 기울어지게 표시합니다. 대부분 기울어진 형태에 맞게 글..

퀴즈 1. 코드 낚시게임 우선 랜덤 값을 받아서 물고기 3마리를 배치한다. 그리고 낚시꾼이 캐스팅을한다. 캐스팅을 할 때는 예를 들어(0이상, 4이하) 로 하여야 한다.. 그리고 나서 위 아래 왼쪽 오른쪽으로 이동을 해서 물고기를 다잡으면 됩니다.

CSS의 기본 선택자 전체 선택자 스타일을 모든 요소에 적용할 때 사용한다. * 를 사용한다. 특정 요소에 스타일을 적용하는 타입 선택자 특정 태그를 사용한 모든 요소에 스타일을 적용한다. 이런 식으로 사용한다. 특정 부분에 스타일 적용하는 클래스 선택자 특정 부분만 선택해서 스타일을 적용하고 싶을 때 .클래스명 { 스타일 규칙 } 특정 부분에 스타일을 한 번만 적용할 수 있는 id 선택 마침표(.) 대신 # 기호를 사용한다는 점만 제외하면 스타일을 정의하는 방법은 클래스 선택자와 같. 클래스 선택자가 문서에서 여러 번 적용할 수 있는 반 면, id 선택자는 문서에서 한 번만 적용할 수 있다는 것 같은 스타일 규칙을 사용하는 요소들을 묶어주는 그룹 선택 선택자를 이용해 스타일을 정의하다 보면 여러 선택자..

대표적인 스타일 시트 스타일 시트의 갈래 기본형 선택자 { 속성1 : 속성값; 속성2: 속성값2 } 맨 앞의 선택자는 스타일을 어느 태그에 적용할 것인지 알려주는 것. 중괄호 사이에는 스타일 정보를 넣는다. 속성과 같이 하나의 쌍으로 이루어진 것을 스타일 규칙 브라우저 기본 스타일 : CSS를 적용하지 않더라도 웹 브라우저에 표시할 때는 기본 스타일을 사용. 인라인 스타일 : 스타일 시트를 사용하지 않고 스타일을 적용할 대상에 직접 표시 내부 스타일 시트 : 웹 문서 안에서 사용할 스타일을 같은 문서 안에 정리한 것. 외부 스타일 시트 : 스타일 정보를 따로 저장해 놓은 외부 스타일 시트 레드향 껍질에 붉은 빛이 돌아 레드향이라 불린다. 레드향은 한라봉과 귤을 교배한 것으로 일반 귤보다 2~3배 크고, ..

태그 이외의 태그들 1) : 여러 줄을 입력하는 텍스트 영역 태그 여러 줄을 입력하는 텍스트 영역 속성 2) , : 드롭다운 목록을 만들어 줌 사용자가 내용을 직접 입력하지 않고, 여러 옵션 중에서 선택하게 하려면 드롭다운 목록이나 데이터 목록을 사용함. 전자는 태그로 드롭다운 목록의 시작과 끝을 표시하고, 그 안에 태그를 사용하여 원하는 항목을 추가한다. 태그에는 value 속성을 이용해 서버로 넘겨주는 값을 지정한다. 2-1) 태그의 속성 태그를 사용해 만든 드롭다운 목록은 기본적으로 옵션이 하나만 표시된다. 옆에 있는 화살표를 클릭해 필요한 항목을 선택할 수 있다. 이 때 size 속성이나 multiple 속성을 이용하면 드롭다운 목록의 크기나 선택할 항목의 개수를 조절할 수 있음. 속성 2-2) ..

input 태그의 주요 속성 1) autofocus : 자동으로 입력 커서를 가져다 놓음 이제는 자바스크립트 이용할 필요 없음 기본형 2) placehorder : 힌트를 표시해 줌 텍스트 필드 앞에 제목을 사용하지 않고도 사용자에게 해당 필드에 어떤 내용을 입력해야 할 지 알려줄 수 있음. 예제 뉴진스 앨범 주문하기 배송 정보 이름 배송 주소 이메일 연락처 배송 지정 (주문일로부터 최소 3일 이후) 실행 결과 3) readonly : 읽기 전용 필드를 만들어 줌. readonly라고만 쓰거나 readonly = "readonly" 또는 readonly = "true" 로 지정한다. 4) required : 필수 입력 필드를 지정 내용을 폼에 입력한 후 submit 버튼을 클릭하면 폼을 서버로 전송하는데..

input 태그의 type 속성 1) type="text", type="password" : 텍스트와 비밀번호를 나타냄 텍스트 필드는 한 줄짜리 일반 텍스트를 입력할 때 사용. 비밀번호 필드는 입력하는 내용을 화면에 보여주지 않아야 하므로, 특수문자를 사용 이 점만 제외하면 텍스트 필드와 똑같이 동작하고, 같은 속성을 사용한다. 텍스트, 비밀 번호 필드에서 사용하는 주요 속성 예제 아이디: 비밀번호: 실행 결과 2) type="search", type="url", type="email", type="tel" : 용도에 맞게 입력 type = "search" 는 검색을 위한 텍스트 필드로 인식 type = "url"은 웹 주소를 입력할 필드. type ="email"은 이메일 주소를 입력. 입력값이 지정한..

폼 폼과 관련된 작업은 정보를 저장하거나 검색, 수정하는 것이 대부분인데, 모두 데이터베이스를 기반으로 작동한다. : 폼을 만드는 태그 몇 가지 속성을 사용해서 입력받은 자료를 어떤 방식으로 서버로 넘길 것인지 서버에서 어떤 프로그램을 이용해 처리할 것인지를 지정함. 태그의 속성 자동완성 기능 : autocomplete 속성 기본 속성은 on. autocomplete ="off" 라고 지정하면 됨. , : 폼 요소를 그룹으로 묶는 태그 하나의 폼 안에서 여러 구역을 나누어 표시할 때 태그를 사용 태그는 다음과 같이 태그로 묶은 그룹에 제목을 붙일 수 있음 : 폼 요소에 레이블을 붙이는 태그 lable이란 입력란 가까이에 아이디나 비밀번호 처럼 붙여 놓은 텍스트 이 태그를 사용하면 폼 요소와 레이블 텍스트..