2020년/TIL(Today I Learn)

20.06.02 코딩 공부

풀빵이 2020. 6. 3. 15:27

<HTML/CSS 기본개념 공부할 수 있는 사이트>

 

http://webberstudy.com/

 : 기본 개념부터 실전에서 주의해야할 사항까지 꼼꼼히 정리해주심

 

https://codepen.io/

 : JS, CSS, HTML이 각각 어떻게 구현되는지 즉각적으로 볼 수 있는 사이트

 

 

 

 

 

<새롭게 배운 부분>

  1. html에 css를 입힐 때 <style>태그보다는 css 파일을 만들어서 <head>에 link하는 것이 더 안정적임.
  2. css도 html처럼 확장자로 지정해서 파일을 만들 수 있음.
  3. 각 태그에 id, class 붙이는 연습
  4. <p>태그는 블록형태지만 안에는 인라인 태그만 들어갈 수 있음. 
<!---html 파일에 css 파일을 링크할 때 넣는 방식 --->

<link href="style.css" type="text/css" rel="stylesheet" />

 

 

 

 

 

<시도해보고 싶은 부분>

  1. 블로깅 할 때 목차 만들기 : id 태그를 제목마다 붙여서 연결할 수 있을 것 같은데 시도해봐야겠다.
  2. 에어비앤비 등 특정 사이트 클론 만들어보기
  3. 좀 더 연습이 되면 티스토리 레이아웃도 수정해보기

      참고) http://webberstudy.com/html-css/html-1/anchor-element-id-attribute/

 

a 요소와 id 속성

HTML의 하이퍼텍스트(Hyper Text)를 나타내는 a 태그(요소)에 대해 알아 봅니다. a 태그의 기능과 접근성, 그리고 id 속성의 역할을 살펴 봅니다.

webberstudy.com

 

 

 

<연습 및 공부가 필요한 부분>

1. 레이아웃 구성시 relative와 absolute의 구현 차이 고민해보기

2. grid와 flexbox 연습해보기

3. 상대주소와 절대주소에 대해 다시 정리하고 연습해보기((웨버스터디/HTML(초급)/HTML(기초))