[나만의블로그개발하기] 01 html 기초

HTML 기초나만의 블로그 개발해보기

01

쓰기만 했지 어떻게 만드는지 모르는 당신!

본격 입장 바꿔 생각해보기 프로젝트

쓸때는 편해도 만들땐 어렵단다 주변에서 찾는 HTML 우리가 쓸 HTML 알아보자 조심하세요

웹이란?

너가 알고 있는 그것입니다


웹사이트 HTTP 프로토콜을 사용, URL에서 받아오는 HTML로 써진 문서


HTTP 프로토콜URL = 주소

Front-end 우리가 실제로 보는 부분들

Back-end 보이지는 않지만 서비스가 돌아가는데 필요한 부분들



HYPERTEXT MARKUP LANGUAGE


HYPERTEXT MARKUP LANGUAGE뼈대 잡는 녀석

태그라는 박스로 감싸고 쌓으면 됩니다 지토랑 배운 쉬운 단어들을 기억해보세요



HOW TO [?]> USE > PLAY > MAKE

<tag attribute=“ ”> </tag>각각의 태그마다 속성을 지정가능함

꾸밀 것들, 속성, 이름 등

12345678910

<!DOCTYPE html><html><head><title>제목</title><meta charset=“UTF-8”>

</head><body>Hello World!

</body></html>

12345678910



</body></html>

<!DOCTYPE html> 독타입 Doctype 문서타입을 나타냄

12345678910



</body></html>

<head> 태그 머리에는 중요한 정보들이 들어가 있음

<title> - 문서의 제목 <meta> - 이 문서에 대한 세세한 설명 <link> - 주로 CSS 문서 불러올 때 <script> - 주로 Javascript 문서 불러올 때

<head><title>제목</title><meta charset=“UTF-8”>

</head>

12345678910



</body></html>

<body> 태그 페이지의 구조, 글씨, 이미지 등 실질적인 내용을 이루는 부분

<body>Hello World!

</body>


Sublime Text 3구글에 검색해서 설치해주세요!

HTML도 언어입니다: 대표적으로 안먹는 키들


왜 키보드가 있는데 입력이 안되니ㅠㅠ

HTML도 언어입니다: 대표적으로 안먹는 키들왜 키보드가 있는데 입력이 안되니ㅠㅠ

< >

 

&

HTML만 짰더니 예쁘지가 않다

압니다

그렇다고너가편하게짜라는법은없죠

깔깔깔

CASCADING STYLE SHEETS

CASCADING STYLE SHEETS꾸며주는 놈

주로 이런걸 사용합니다 쪼금 어↗려워↘요

CSS에 대하여 어떻게 쓸까 테크닉 +a 노오오오력하세요

이름을 붙일 수 있어요


꾸밀녀석 { 속성: 값;}


나 동생

아빠 삼촌고모큰아빠 작은아빠

할머니 할아버지


나 동생

아빠 삼촌고모큰아빠 작은아빠

할머니 할아버지

#id 나보다 위

.class 엄마 아빠의 아들 할머니 할아버지의 손자


CSS 실력을 한단계 높여주는

알파테크닉


padding & marginpadding 대상 안의 부피를 크게 만듬

margin 주변으로부터 밀어내서 공간을 만듬

absolute

fixedabsolute


position


inline 같은 녀석들로 생각하고 같은줄에

block 다른 줄에

inline-block 같은 줄에 놓되, 다른 녀석으로 생각

display


방향 관련해서 입력할때에는

시계방향으로 위/오른쪽/아래/왼쪽

인생은 실전이야

백견이불여일코딩백번 보는 것이 코딩 한번 하는 것보다 못하다

감사합니다!서버 그리고 데이터베이스

수업때 만나요 :)

[나만의블로그개발하기] 01 html 기초

Education