본문 바로가기
취 미 향

유익한 무료 코딩강의, 코딩야학 3기 WEB1 완강하다!

by harumood 2018. 1. 16.
반응형


코딩야학 3기 완강하다.


티스토리 블로그를 하면서 항상 HTML을 조금 알면 어떨까?

블로그 페이지를 관리하는데 조금 더 좋지 않을까? 라는 생각을 가지고 있었어요.

구글 애드센스를 설치할때도 그렇고 HTML 까막눈인 저에게는 외계어로만 보였으니까요.


그렇게 생각만 가지고 있던 중에 호랑이님 블로그에서 온라인 코딩 무료강의를 접하게 되었어요!


10일 동안 대략 4시간 분량의 공부를 하는 것인데, 가볍게 HTML 코딩에 입문하면 좋겠다는 생각이 들었죠!


그래서 바로 신청했습니다.


.

.

.

2018년 1월 3일부터 16일까지 3기 WEB1 을 공부할 수 있는 기간이에요.

바로 오늘이 마지막 날이고

저는 '수업을 마치며' 를 들으며 강의를 끝냈습니다.



결론적으로 저는 아주 간단한 웹사이트를 만들 수 있게 되었어요.


아톰이란 프로그램을 설치하고 


HTML 언어를 배우고


깃허브를 이용하여 웹사이트를 만들었습니다.


따라하면서 차근차근 배워갔습니다.


내용이 많지 않기 때문에 쉽게 배울 수 있었어요.





몇가지 배운 HTML 언어를 정리해보려고 해요.



수 많은 태그들이 있는데, 우리는 그 태그를 다 외울 필요가 없어요.



https://www.advancedwebranking.com/html/


위의 이미지는 통계에 따라 가장 많이 사용되는 태그들이에요. 기본적으로 알고 있으면 도움이 되겠죠?


가장 처음 배운 태그는  강조태그입니다.

강조태그는 글씨가 진하게 변해요.


강조 <strong> 강조  </strong>


이렇게 밑줄 태그도 배웠구요.


* 밑줄 <u> </u>


제목크기 태그도 배웠어요.

검색창엔 [HTML H1 tag] 라고 검색을 하면 편해요.


<h1> </h1>

<h2> </h2>

<h3> </h3>

<h4> </h4>

<h5> </h5>

<h6> </h6>


숫자가 클수록 글씨가 작아집니다.


<> ,</> 이렇게 괄호가 두개인 이유는 열리는 태그와 닫히는 태그가 있기 때문에요.

그래서 꼭 뒤에 </> 닫히는 태그를 써줘야 합니다.


저에게 꼭 필요했던 <줄바꿈> 태그!!

검색창엔 [html new line tag] 라고 검색을 하시면 되요.

이 태그의 특징은 닫히는 태그가 없어요.

그래서 그냥

<br

이렇게 입력하시면 됩니다.

너무 간단해서 이미지 태그 넣은 후에 앞뒤로 요긴하게 쓰고 있어요:)


html로 글을 쓰다보면 단락을 띄워야 하는데요.

단락 태그는  검색차에 [html paragraph tag] 라고 검색했어요.


이렇게 수업에서는 검색하는 방법을 알려줘요.

 

사실 코딩이란게, 유니티도 그렇고 배워보니 검색을 잘하는게 1등이더라구요.

모두 외울 수는 없으니까요 ㅎㅎ


단락 태그는

<p></p> 입니다. 


<p>동해물과 백두산이 마르고 닳도록 ~~우리나라만세.</p>  

이렇게 사용하시면 되요.


만약 단락을 더 띄우고 싶다면

<p style = "margin-top: 45px;"> </p>

이런식으로 몇 픽셀 띄어쓸건지 숫자를 변경하시면 되요.

이건 좀 어려웠네요 ㅎㅎ 



이미지 추가 태그

<img> 

<img src=" "> 입니다.

'src'는 source(소스)의 약자입니다.

예를들어

<img src= "cording.jpg" width ="100%">

 이렇게 표시하면 되요.

width는 넓이를 조절하시는거에요. 숫자를 바꿔서 알맞은 크기를 조절하세요.


 그 외에도 부모자식 관계의 태그들이 있어요.



<html>

<head>

<title>

<body>


이렇게 말이죠.

그래서 웹페이지의 소스를 보시면 아마 위에 순서로 되어있는 걸 알 수 있을 거에요.


이 외에도 나머지들은 수업을 따라하면서 html 태그를 따라하며 배워 보았는데요.


웹사이트의 구성을 아주 아주 아주 입문단계정도 배웠다고 생각해요.


더 배움을 원한다면 준비되어있는 강의들이 엄청 많더라구요.


저는 일단 간단하게 HTML에 대해서 궁금한 점은 풀렸으니, 나중에 또 궁금한 점이 생간다면 추가적으로 배워볼 생각이에요.




마지막으로 완강 수료증을 올려보아요!


제가 배운 생활코딩이 궁금하시다면


https://opentutorials.org/course/3084


사이트를 클릭해 보세요^^






반응형

댓글