본문 바로가기
SW 코딩/HTML & CSS 기초

[html/css] html,css 란 무엇일까?(뜻,개념,기초),메모장으로 작성법

2020. 6. 21.
반응형

<티스토리 블로그를 운영하기 위한 기초적인 수준의 html/css 기본 개념 포스팅입니다>

티스토리 블로그를 하다보면 html, css를 수정해야 되는 경우가 있습니다.


다른 블로거분들의 글들을 보고 따라하면 어느정도 수정은 가능하지만 이해하지 못하고 수정하는게 많아 html과 css의 기초에 대해서 공부할겸 포스팅을 시작해볼까 합니다. 


html, css 어디에 쓰는걸까?



크롬으로 네이버에 들어가서 F12를 눌러보시면 우측에 소스코드들이 나옵니다.


해당 코드에서 html, css 코드를 볼수가 있습니다. 


네이버 뿐만 아니라 다른 사이트에 가도 html, css 코드를 보실 수 있습니다.


한마디로 html, css는 웹페이지를 만드는데 쓰이는 언어입니다!



html, css, JavaScript 도대체 무슨 차이?!


html, css와 추가로 JavaScript는 도대체 무슨 의미일까요?


html은 사람으로 치면은 뼈대를 만들어주는 과정이라고 보시면됩니다.


css는 그 뼈대위에 옷, 피부색 등을 더해서 조금 더 이쁘게 만들어 주는 과정이구요.


JavaScript는 움직이는 동작을 만들어 줍니다.






조금 더 웹페이지 스럽게 설명을해보면 HTML로 제목, 문단,표를 구성하고

CSS 폰트, 색상, 배경색 등을 구성합니다.

그리고 JavaScript로 움직이는 화면, 팝업 화면 등을 구현하게 됩니다.


html,css 연습장으로 맛보기


바로 실습하나 해보겠습니다.


연습장을 열어서 <html> ~ </html>까지 작성해줍니다.


다른 이름으로 저장하기를 눌러줍니다.
<메모장 파일>

test.html






파일 이름: test.html
파일 형식: 모든 파일

인코딩: UTF-8 


저장한 후에 저장한 파일을 실행!!





위와 같은 화면이 나오면 html 첫 단계 성공입니다!


다음 포스팅부터는 본격적으로 학습을 시작해보도록 하겠습니다.

2020/06/25 - [SW 공부/HTML & CSS] - [정보 공장] html tag 태그, content 컨텐츠, element 요소란 무엇일까? 뜻,정의,이해


● 개인적으로 공부하며 정리한 내용입니다 ●


 잘못된 내용이 있으면 언제든 답글 달아주세요 


감사합니다



댓글


loading