예습/웹표준 수업(22.2.28 ~ 22.4.25)
내일배움카드(재직자) 웹표준 수업 / 2월28일 (월) 1회차
밀김
2022. 2. 28. 21:37
728x90
<웹코딩 프로그램 설치>
1. 비주얼 스튜디오 설치
2. 프로그램 실행
3. extension(확장) 단추 클릭
4. korean language 검색 - 첫번째 뜨는거 설치
5. extension 단추 클릭
6. live server(코딩하는대로 바로 볼수있는) 검색 - 첫번째 뜨는거 설치
*반응형 웹디자인 : 모바일이면 모바일,피씨면 피씨에 맞게 화면이 바뀌는것
<코딩 시작>
1. 파일 - 새파일(컨트롤+N)
2. 파일 - 저장(컨트롤+S)
-파일명.html
3. 기본 구조 코드 입력
<html>
<head>
<title>제목</title>
</head>
<body>
본문내용
</body>
</html>
<글자태그 종류>
▶제목(heading): 숫자가 작을수록 큰 글자
<h1>글자입력</h1>
▶본문(patagraph)
<P>글자입력</P>
▶글자를 입력한 그대로 표시(preformat:띄어쓰기,줄바꿈을 그대로 표시해줌) -잘 안씀. 접근성 기능 낮음
<pre>글자입력</pre>
▶글자 중간에서 줄바꿈
<br>
▶가로줄 삽입
<hr>
▶인용문
<blockquote>글자입력</blockquote>
▶강조
<strong>글자</strong>
▶굵게(bold)
<b>글자</b>
▶기울임 강조
<em>글자</em>
▶기울임(italic)
<i>글자</i>
▶형광색 강조
<mark>글자</mark>
▶묶기(모양 변화없이 구분만 해주는 강조)
<span>글자</span>
*태그는 2가지로 구분
▶블록(block)요소 : 태그가 열렸다 닫히면 다음내용에서 줄바꿈
▶인라인(inline)요소 : 태그를 입력해도 다음 내용에서 줄 안바뀜
*CT+ENTER : 코딩할때 단락 한번에 바꾸기
*기본 구조 코드를 빨리 입력하려면?
: !(느낌표) 입력 후 Enter
lang="en"(영어) > lang="ko"(한국어) 변경
★html은 꾸미기가 아닌,단지 코드 구분이 목적인것이다★
728x90