WEB

  1. HTML
  2. CSS
  3. JavaScript

모각코 1주차 HTML 언어 기초문법

리액트를 배우기 전에 알아야할 기초적인 웹언어를 배워야 할 필요성을 느꼈다. 강조하고 싶다. (굵게)bord를 어떻게 할까? 태그를 사용해야한다. 더 강조하고 싶다면 (밑줄)underline을 어떻게 칠 수 있을까? 태그란? 옷을 설명하는 것 처럼 문법을 설명해주는 것 이다. 어려운 것은 중요하고 쉬운것은 중요하지 않다고 느껴지지만 처음에 배우는 쉬운 것이 중요하다!! W3school 웹을 만드는 곳 이다. 우클릭 페이지 소스 어떤 html코드로 이루어져 있는지 알 수 있다.

body란?

바디를 설명하는 태그는 head태그로 묶기로 약속함 본문은 body라는 태그로 묶기로 약속함 위의코드와 아래 코드와는 차이가 있음 밑에 있는 코드들은 본문이다.
위에 있는 코드들은 본문을 설명한다. 웹브라우저가 열때 utf-8로 열도록 명시해줌 사용자에게 웹페이지 제목을 명시적으로 알려줌 검색엔진은 타이틀을 책표지같은 개념으로 사용함

h1 태그는 무엇일까?

추천 검색어 HTML h1 tag

This is heading 1

This is heading 2

This is heading 3

This is heading 4

This is heading 5
This is heading 6

짐작: 큰제목 소제목 크기별 제목 같다.
숫자 커질수록 크기가 작아진다. 일반적인 텍스트보단 글씨가 굵고 줄바꿈이 된다. heading 제목이란 것이다. 제목을 나타내는 태그 였던 것이다.

댓글엔 많은 기능성이 필요하다 backend기능도 필요하고 데이터베이스도 필요하다 남들이 만든 댓글을 활용해보자 Livere Disqus

밑천으로서 알고 있어야 할 태그들
통계로 분석해 보았을 때 advencebranking.com 전세계있는 웹페이지들이 몇개의 태그로 이루어져 있는지 25개와 30개 정도로 사용됨 처음 배우는 것들은 창조성의 원천 같은 것이다 응용 하기에 좋기 때문이다.
통계를 통해서 어느 방향으로 가야할지를 정해 보아라!

줄바꿈을 해주는 태그
br 태그는 닫히는 태그가 없다
추천 검색어 html new line tag

여백과 여백이 40px 만큼 떨어지게 됨 원하는 만큼 떨어 뜨릴 수 있다.
css 이다.
단락을 만들때 쓰라고 만들어 놓은 태그
추천 검색어 html paragraph tag

css 에서 태그와 태그 사이에 여백을 나타내는 코드 두번째 태그 에다가 style="" 속성의 값을 쓴다. opentutorials.org 라는 사이트가 있음 검색엔진은 웹사이트 html을 분석한다. 검색엔진에게 더 노출이 잘 되는 것이 중요하다 그래서 소스가 깔끔하게 적혀지는게 중요하다. 정보를 탄탄히 하는 것이 중요 html을 의미에 맞게 정확히 사용하는것이 굉장히 중요하다 웹의 핵심적인 철학은 접근성이다. 개방성 accessibility 정보로 부터 소외되지 않도록 해준다.

글씨만 있으니 답답하다 사진이나 그림을 넣고 싶다! 이미지를 넣고 싶을때 사용하는 태그는 img 이다. 태그의 이름만으로는 정보가 부족할때가 있다. 새로운 문법을 출연 시킨다. 어떤 이미지인지 알려주도록 속성 source ,src를 쓴다. 주소를 쓴다. attribute 위치는 상관이 없다. 태그 이름만으로 정보 부족할때 속성을 통해서 많은 의미를 부여할 수 있다. unsplash.com 저작권 없이 사용할 수 있는 이미지들이다.

부모와 자식 포함관계로 있는 태그들

목차를 완성해 보기 목차 쓸때 사용하라고 있는 태그 list인 li를 사용해라 ol은 자동으로 숫자를 numbering 해준다. 테이블은 3대가 같이 다닌다.
오리엔테이션 100%
웹,코딩,HTMlL 80%
링크를 나타내는 a 태그 사용설명서 찾을때 검색어:
html specification
링크 걸고 싶은 곳에 감싸!!
title은 툴팁을 띄우게 하는것 target은 새로운 탭으로 열리게 끔 하는 것