HTTP/HTML5&JavaScript8 CSS 표현하기 #3 CSS 폰트, 테이블, 마진, 패딩 기본 설정 font-* 속성 : 서체 크기, 스타일, 굵기 조절 p{ font-size : 11pt; font-style : ltalic; font-weight : bold; } 텍스트 정렬 text-align: center; // left, right, center, justify(양끝 정렬), auot(기본 정렬) - 세로 정렬 vertical-align: text-top 텍스트 상단에 정렬 텍스트 인덴트 : 단락의 들여쓰기 text-indent : 5em; 텍스트 컬러 설정 : color: #FF00FF; 배경 설정 background-color: gray; 배경 이미지 background-image: url("/a.png") background-repeat: - repeat (배경 이미지를 가로 세로로 연속.. 2021. 7. 28. CSS 표현하기 #2 CSS 기본 정의 타입 선택자 - HTML 요소명, 요소의 클래스 속성 값, ID 값 ex) h1 {color: pink;} - 전체 적용 되어짐 - 만일 단란 중 특정 단락만 css 적용을 하고 싶다면 - 클래스 선택자 ex) - 동일 class 가질 수 있다. 그룹으로 묶는 개념으로 보면 된다. .myhtml { color: gray; font-weight: blod; } - ID 선택자 - 문서 유일의 값 - #pink { color: grey; font-weight: blod; } - 그룹 지정하기 h1, h2, h3, #pink { color: brown; } - pink ID도 같은 그룹으로 지정할 수 있다. ,를 사용 - 고급 선택자 - 특정 요소의 하위 요소는 - 자손 요소가 되어진다. - 하위 선택자 : .. 2021. 7. 23. CSS 표현하기 #1 CSS 기본 이해 CSS - HTML 요소에 스타일 적용을 하기 위해서 - 디자인을 정의, 관리, 재활용하는데 용이하다. - 하나의 css 파일은 다수의 html 에서 사용할 수 있다. - CSS 파일을 만들어 HTML에 연결 (가장 권장) -> 텍스트 크기 및 스타일, 요소들의 레이아웃, 그림 등의 크기 테두리, 배경 색, 화면 전환이나 요소 움직임 CSS 기술방식 - 선택자 { 속성 선언 } ex) h1{font-size: 1.5em;} h2{ width: 300px; height: 50px; font-size: 1.5em; color: red; font-weight: blod; } > style 요소를 사용한 CSS 적용 부분에 선택자를 이용하여 style 요소 정의 > 외부 CSS 파일 HTML 문서에 연결 1. .. 2021. 7. 19. HTML 문서구조 #3 구조를 설정을 위한 요소 학습하기 form 요소 - HTML의 서식을 정의하는 요소 action : 서식에서 전송 단추를 눌렀을 때 내용이 전송되는 서버 파일의 URL method : 폼이 전송되는 방식을 결정, GET과 POST 중 선택 고객 이름: 고객 이름: input 요소 - 입력 데이터 필드 ex) text, password, hide, radio, submit, reset label 요소 - 서식 입력 요소의 캡션. label로 하나로 묶어줄 수 있음 이름 : 이름 : input 요소 - name 속성 : 서식 값의 이름, - required 속성 : 반드시 입력되어야 함을 의미한다. - placeholder 속성 : 입력 폼에 짧은 힌트를 의미한다. - progress, meter 요소 : 작업의 진척도를 표시하기 위하여 사.. 2021. 7. 19. 이전 1 2 다음 728x90 반응형
