CSS : Basic (declaration method, css selector)

declaration method

built-in way

<style>
	div {
		color: red;
		margin: 20px;
	}
</style>

inline method

<div style="color: red; margin: 20px;"></div>

Link method ⇒ Parallel method

<link rel="stylesheet" herf="./css/main.css">

import method

@import url("./box.css");

 

css selector

basic

// Universal Selector
* {
	color: red;
}

// Type Selector
li {
	color: red;
}

// Class Selector
.orange {
	color: red;
}

// ID Selector
#orange {
	color: red;
}

complex

// Basic Combinator
span.orange{
	color: red;
}

// Child Combinator
ul > .orange {
	color: red;
}

// Descendant Combinator
div .orange {
	color: red;
}

// Adjacent Sibling Combinator
.orange + li {
	color: red;
}

// General Sibling Combinator
.orange ~ li {
	color: red;
}