본문 바로가기

일상

생활코딩 HTML+CSS 2

수 많은 사람들이 코딩을 공부한다. 
전국 수백개의 컴공과에서 매년 배출해내는 졸업생들과 

수많은 비전공자 개발자들이 함께 늘어나고 있다.  

그 주류에 올라타려고 배우기엔 오래 버티기가 힘들것이고,

무엇이든지 재미가 있어야한다 는 나의 생각!

비단 코딩뿐이 아니라 다른 직업군도 마찬가지다. 
성장하는 재미, 성취하는 재미, 돈을 버는 재미 중 뭐든지 하나라도 있어야 한다.

 

친구가 하는 것을 보고 호기심이 생겨 정말 단순하게 시작한 생활코딩.

하지만 생각보다 코딩은 많은 곳에서 쓰이고 있었다.

꼭 개발자가 되지 않더라도, 새로운 것을 공부하는건 좋은 경험이 될것이다.

 


코딩을 하며 느낀 것은 두가지.

1. 항상 내가 어디에 있는지 확인하기 

2. 시작과 끝이 중요하다. 

 

여러 장의 종이가 모여 한 권의 책이 되듯이,

수 많은 링크들이 모여 웹페이지가 된다.

이때 각 링크들의 코드를 수정하다보면, 내가 어디에 있는지 헷갈리더라. 

막 엉뚱한 페이지 수정하고나서 구현하면 어..왜 안되지.. 막 이런다.

항상 내가 어디에 와있는지 페이지를 체크해야한다.

 

또 태그의 시작과 끝이 마무리가 되어야 코드가 활성화 된다.

<>, </>로 구성되는 태그를 잊지않고 마무리하자. 


꼭 코드를 다 외울 필요는 없다. 자주쓰는것은 알아서 외워진다.

 

1. <p> 문맥을 형성 (<br>는 단순 줄바꾸기) <br>보다 더 다양한 정보를 담을 수 있다는 점에서 정교하다.

2. <u> 텍스트 밑줄 (underline)

3.<h1><h2>...... 글자크기

4. 디자인적으로 아쉬운 부분은 CSS를 통해 시각적으로 보충한다. 이를 테면 p뒤에 style이나 여백을 주는 margin 등을 응용.

5. <img src="이미지.jpg"> 이미지 삽입, <img width="100%" src="이미지.jpg"> 식으로 태그에 정보를 추가하는것이 가능하다.

6. 부모와 자식태그 (태그+리스트) <ul>과일</ul>

                                               <li>포도<li>

                                               <li>사과<li>

혹은 <ol>과 <li>코드로 하면 <li>에 자동으로 숫자가 카운트 된다. 

7. <title> 탭 이름 수정하기 (책 표지)

 

8. 구조를 만드는 방법

<!doctype html>

<html> :우두머리

<head> :body를 설명하는 태그, 이 밑에 title이나 meta charset="utf-8" 등이 들어감

<body> :본문

 

9. <a href="www.naver.com"></a> 링크 태그. 

      <a href="www.naver.com" target="_blank"> 는 새 탭으로 열기

      <a href="www.naver.com" title="네이버"> 는 링그에 태그 달기

 

10. 나의 깃허브 계정 생성 및 첫 업로드 완료 :)

 

 

728x90
반응형