본문 바로가기

분류 전체보기344

CSS 선택자(그룹, 자손, 자식, 일반 형제, 인접 형제, 속성, 가상) ✔ 그룹 선택자 1. 그룹 선택자 여러개의 요소를 나열하고 (,)로 구분하여 스타일을 적용 h2, p {text-align: center;} 제목 HTML 구조 안녕하세요 를 알아볼게요 HTML구조 ✔ 그룹 선택자 코드 DOCTYPE html> 그룹선택자 h2,p,h3,ul {text-align: center;} h2 {color: deepskyblue;font-size: 50px;} li {display: inline-block; margin-right: 30px; font-weight: bold; color: deeppink;} 그룹선택자 여러개의 요소를 나열하고 (,)로 구분하여 스타일을 적용 선택자의 종류 전체 요소 아이디 클래스 그룹 ✔ 그룹 선택자 결과 ✔ 자손 선택자 2. 자손 선택자 조상요.. 2022. 10. 27.
CSS (상속, 전체/ id /class 선택자) ✔ 상속 ✔ 상속 부모 요소의 속성값이 자식 요소에게 전달되는 것 과제. 본인의 홈페이지에 아래와 같이 적용 index.html : 대문 index.html 메뉴 [홈(index.html) 인터넷기사(news.html) 이력서(resume.html) 즐겨찾기(favorite) ] 즐겨찾기 본인이 자주가는 웹사이트 3개이사 소개하는 페이지(iframe 적용) ✔ 상속 코드 DOCTYPE html> 상속 div{ color: deeppink; border : 3px dotted gold; padding: 30px; } 상속 div 영역 상속이란 부모 요소의 속성값이 자식 요소에게 전달되는 속성 ✔ 상속 결과 ✔ 전체 선택자 선택자 1. 전체 선택자 스타일을 모든 요소에 적용 * { padding: 0; ma.. 2022. 10. 26.
CSS (기본, 인라인/내부/외부 스타일) ✔ CSS CSS(Cascading Style Sheets) 웹 페이지의 특정 요소 또는 요소 그룹에 적용할 스타일 그룹을 지정하는 규칙을 정의하는 언어 CSS 문법 HTML 문서 사이에 요소를 사용하여 적용하는 방법 ✔ 내부스타일 코드 DOCTYPE html> 내부 스타일 h2{font-size: 50px;} /* h2 요소의 사이즈를 50px로 설정*/ p{font-size: 25;} ul{list-style: none;} li{color: deeppink; font-weight: bold; display: inline-block; margin-right: 30px;} 내부 스타일 CSS를 사용하는 방법 인라인 스타일 내부 스타일 외부 스타일 ✔ 내부스타일 결과 ✔ 외부 스타일 3. 외부 스타일 웹 .. 2022. 10. 26.
HTML(아이프레임, 폼, 디스플레이 태그) ✔ 아이프레임 아이프레임 - inline frame의 약자 - 웹사이트 안에 또 다른 웹사이트를 삽입 ✔ 아이프레임 코드 아이프레임 홈페이지 &nbsp뉴스기사(새탭)&nbsp이력서(새탭) 즐겨찾기 ✔ 폼 태그 폼 태그 - 웹 페이지에서 사용자로부터 입력을 받을 때 사용하는 태그 - 사용자가 입력한 데이터를 서버로 보낼 때 form 요소를 사용 - 데이터를 묶어 보낸다. form 태그 안에 form 요소를 통해 데이터를 서버로 전달 입력 상자 type 속성 text : 문자를 입력받는 글상자 password : 비밀번호를 입력받는 글상자 radio : 여러개의 옵션 중에서 단 하나의 옵션만을 입력받을 수 있도록 하는 버튼 - 그룹을 맺기 위해서 name 속성의 값이 동일해야 함 checkbox : 여러개의.. 2022. 10. 26.