CSS 기초

juya kim·2020년 10월 18일

css meme 하면 가장 흔히 나오는 짤이다.
유튜브를 슬쩍보고 수박 겉핥기로 css를 잠시 배우고 클론코딩으로 유튜브 일부 화면을 만들어 보고나서 나도 저 짤이 너무나 공감이 됬다. 왜들 css가 어렵다고 하는지 절실히 느꼈다.

그래서 다시 제대로 배우고, 제대로 이해하고자 한다.

📕 CSS ?

📌 cascading style sheet
📌 html 문서를 예쁘게 디자인해주는 언어

selector {
   property : value;
}

selector : 선택자
property : value -> 속성 : 값
; -> 세미콜론 반드시 !!

🍎 별도로 css파일을 만들어서 html에서 불러오기

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

가장 Nice~ 한 방법, 유지보수 및 css 작업 시 골치아플 일을 최대한 덜기 위해서는 위 방법으로 선언하길 추천함.

🍎 ~~html 문서 내에서 선언하기 (비추)~~

<html>
  <head>
    <body>
      <style> <-- css 시작 -->
      ...
      </style>
    </body>
   </head>
</html>

<--inline style-->
<html>
  <head>
    <body>
      <p style="color:red"> 
    </body>
   </head>
</html>

김버그의 CSS는 재밌다

콘텐츠 마케터에서 프론트엔드 개발자로...