Day 1
html, css, javascript란 무엇인지, 웹을 구성할 때 각각 어떤 역할을 하고 서로 어떠한 관계가 있는지 알아보기, html 개념 찾아보기
01. HTML
- 마크업 언어, 웹페이지의 기본적인 형태를 만드는 정적 언어
- <head> 태그와 <body> 태그로 구성되어 있음
- 웹의 구조 담당
02. CSS
- 마크업 언어가 표시되는 방법(색상, 크기 등)을 지정하여 콘텐츠 구조를 꾸며주는 정적 언어
- 웹의 시각적인 표현 담당
03. Javascript
- 브라우저 자체에서 내장된 해석기능을 이용한 클라이언트 기반의 일종의 스크립트 언어
- html과 css로 만들어진 웹페이지를 동적으로 변경해주는 언어
- 웹의 동적 처리 담당
04. html 개념 + 강의 요약
!+tab : 기본적인 html 파일 툴을 가져온다.
- 태그
head 태그
body 태그
1. <title>
: 웹사이트의 제목
2. < h1>, <h2>, <h3>, <h4>, <h5>, <h6>
: 숫자가 커질수록 크기 작아짐 표현
3. <p>
: 문단을 넣을 때 사용하는 태그
4. <input>
: 입력창 의미
type은 해당 태그의 속성 type="text" 타입이라는 속성의 값이 text이다.
5. <button>
: 버튼 태그
style 속성으로 크기나 색상을 설정할 수 있다.
6. <div>
: 여러개의 태그를 구역으로 묶거나 나눌 때 사용하는 태그 > div가 다르면 별도의 줄로 나눠진다.
7. <br>
: html에서 줄바꿈 할 수 있다.
8. <strong>
: 텍스트 강조
9. <a>
: 다른 웹사이트로 가는 링크를 걸어주는 태그
10. <img>
: 이미지 태그 이미지의 src 속성 안에 사용한다. / alt 속성: 이미지 불러오기가 실패 할 때 화면에 보여질 그자
11. UL OL 태그
: 리스팅에 사용되는 태그
<ul>안에 <li>를 넣고 글자를 쓰면, 워드에서 사용하는 것처럼 리스팅이 가능하다
<ol>안에 <li>를 넣고 글자를 쓰면, 자동으로 숫자 넘버링이 붙는다.
12. <table>
: 표를 만드는 태그
<tr>: 테이블의 행 <th> : 테이블의 헤더를 칸 수에 맞게 배치 <td> : 테이블의 내용을 헤더에 맞게 적어줌
<caption> : 테이블의 이름
13. <form>
: 회원가입이나 로그인과 같은 특저 정보들을 묶어서 하나의 폼으로 제출해야할 때 사용하는 태그
3개의 input 태그 / input 태그의 type 속성: 해당 input 태그가 어떤 정보를 입력 받을 지 결정
button의 type을 submit으로 지정 : 버튼을 눌렀을 때 폼의 내용이 전송된다.
14. <select>
: 여러 선택 지 중 하나를 선택하는 태그
<option> 태그를 감싸는 형태
<select name = "이름"> <option value="값"> 서버로 전달되는 형식
'WEB' 카테고리의 다른 글
[WEB] CSS 기본실습(2) (0) | 2022.02.26 |
---|---|
[WEB] CSS 기본실습 (0) | 2022.02.25 |
[WEB] HTML 기본실습(3) (0) | 2022.02.24 |
[WEB] HTML 기본 실습(2) (0) | 2022.02.23 |
[WEB] HTML 기본 실습 (0) | 2022.02.22 |