CSS 기본 사용법

 

CSS 선언

span { color : red ; } (selector, property, value)

 

style을 html 페이지에 적용하는 세 가지 방법

inline

internal

external

 

*inline

HTML 태그 안에다가 넣는 방법을 우리가 inline 이라고 한다. 

<body>

<span style = "color : red;"> Hello World! </span>

</body>

</html>

 

같은 셀렉터로 동일한 속성 값의 어떤 다른 value를 넣었다 그러면 inline에 적용된게 최우선이다.

 

*internal 

구조와 css 섞여 있으면 안좋음.

head안에 넣는다. 

<head>

<span style = "color : red;"> Hello World! </span>

</head>

 

*external 

별도의 css 파일을 만들어서 include 시킨다.

<head>

<meta charset="utf-8" />

<title> World! </title>

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

</head>

 

  1. javascript로 동적으로 css코드를 수정하려고 하면 어떻게 해야 할까요? 나중에 차츰 알게 되지만, 미리 어떤 방법이 있을지 고민해보세요. 
  2. 구글 웹사이트는 어떻게 css를 선언하고 있을까요? 구글 웹사이트(구글 내 여러가지 웹사이트중 하나)에서 소스보기를 해서 CSS 코드를 한번 찾아보세요. internal 방식이나 external 방식 등을 목격할 수 있을 겁니다.

hostinger.com/tutorials/difference-between-inline-external-and-internal-css

'Web' 카테고리의 다른 글

Web11 :: CSS Selector  (0) 2019.01.06
Web10 :: 상속과 우선순위 결정  (0) 2019.01.06
Web08 :: class 와 id  (0) 2019.01.04
Web07 :: HTML 구조설계  (0) 2019.01.04
Web06 :: HTML Layout 태그  (0) 2019.01.03