7월 25일 어제는 간단한 OT를 진행하고 오늘 드디어 첫 수업을 시작했다.

 

첫 수업은 기본태그, inline, style, table 등을 배운다고 하였다. 

 

오늘 배운 내용들로는         

 

html 작성시 기능들⇓

<!DOCTYPE html>                   // HTML5 문서임을 표시 
<html>                                      // html 시작
<head>                                     // 이 문서의 정보를 제공
         <title>테스트 문서</title> // 문서제목(타이틀)
         <meta charset="utf-8" />  // 사용코드 이름 : utf-8(유니코드) 전 세계언어를 표현 가능코드
</head>
<body>
        본문 내용 시작
        정보를 제공
    </body>
</html>                                      // html 끝

html : 인터넷에 데이터를 표시해 주는 언어

css: html을 다지인 해 주는 언어

 

기본태그

<br> : 줄 바꿈 태크 (1줄씩)
<p>문장 태그</p>
-자동으로 줄 바꿈(2줄씩)
<span>글자 태그</span>
<pre></pre> : 작성한 그대로 보여줌 (띄어쓰기 줄바꿈 포함)

table : 표 만들기
  tr : 줄 만들기
    td : 칸 만들기 

 

속성

(태그 안에 있는 옵션들)

img 태그 안에  src속성은 경로를 의미한다.
alt속성은 사진이 없을때 글로 설명
title 속성은 그림위에 마우스 올릴시 글자를 띄움
<img src="img/img10.jpg" alt="햄버거 그림" title="맛있는">

 

스타일 위치

인라인 스타일 : 태그 안에 스타일을 지정
내부 스타일 : <head>와 </head> 사이에 스타일 지정 하는 것

외부 스타일: 파일 외부에서 스타일을 지정해 불러오는 것

 

스타일 우선순위
인라인스타일 > 내부스타일 > 외부스타일

 

선택자

(특정 태그를 지정 할 수 있는것)

 -class, id, name, tag, >, ~
 -class: .(점)으로 표시, 중복사용이 가능하다.

 

그외 단축키 및 기능들

td{$}*30 => 1부터 30까지 자동으로 td를 생성
.date tr td:hover => 커서를 올리면 색상 변경 기능 
#ff0000 = #f00 같은 문자가 올때는 줄일 수 있다
<td colspan="7"> => 7개의 col을 합치겠다.

ctrl + / : 주석(해설)처리 


위와 같은 기능을 배웠고, 배운 것들을 활용해 테이블 제작 실습을 해봤다.

첫날 수업이라 힘들꺼 같았지만 수업을 따라가다 보니 시간도 금방 간거 같고, 강사님께서 친절하게 잘 가르쳐 주신덕분에

이해도 잘 된거 같다.

앞으로 130일 이라는 기간동안 교육을 잘 마쳐서 취업 할 수 있도록 노력 해야겠다.  

+ Recent posts