<!doctype html>
<html>
<head>
<title>CSS grouping elements</title>
<meta charset="utf-8">
<style>
.lovey-dovey {
color: red;
}
#official-info {
background-color: aqua;
}
</style>
</head>
<body>
<h1>All About Cats</h1> <h3>Why I <span class="lovey-dovey">Love</span> Cats</h3>span태그를 사용하여 class로 지정하여 style태그에 색을 지정해주었다.
<ul>
<li>Furry
<li>Cute
<li>Evil
</ul> <div id="officail-info"><h3>Official Info on Cats</h3>div태그를 사용해서 원하는 곳을 그룹화 하여 style태그로 해당블럭의 색을 입힐수있다.
<p><img src="https://www.kasandbox.org/programming-images/animals/cat.png" width="100"> The cat (Felis catus), also known as the domestic cat or housecat to distinguish it from other felines and felids, is a small domesticated carnivorous mammal that is valued by humans for its companionship and ability to hunt vermin and household pests. Cats have been associated with humans for at least 9,500 years, and are currently the most popular pet in the world. Owing to their close association with humans, cats are now found almost everywhere on Earth.</p>
<p>Cats are similar in anatomy to the other felids, with strong, flexible bodies, quick reflexes, sharp retractable claws, and teeth adapted to killing small prey. As nocturnal predators, cats use their acute hearing and ability to see in near darkness to locate prey. Not only can cats hear sounds too faint for human ears, they can also hear sounds higher in frequency than humans can perceive. This is because cats' usual prey (particularly rodents such as mice) make high frequency noises, so cats' hearing has evolved to pinpoint these faint high-pitched sounds. Cats rely more on smell than taste, and have a vastly better sense of smell than humans.</p>
<p>Despite being solitary hunters, cats are a social species and use a variety of vocalizations, pheromones and types of body language for communication. These include meowing, purring, trilling, hissing, growling, and grunting.</p>
<p>Cats have a rapid breeding rate. Under controlled breeding, they can be bred and shown as registered pedigree pets, a hobby known as cat fancy. Failure to control the breeding of pet cats by spaying and neutering and the abandonment of former household pets has resulted in problems caused by large numbers of feral cats worldwide, with a population of up to 60 million of these animals in the United States alone.</p>
</div>
Read more on <a href="http://en.wikipedia.org/wiki/Cat">Wikipedia</a>.
</body>
</html>span태그는 인라인 요소를 만들고 div는 블록요소를 만든다.
css세계에는 두 가지 종류의 요소가있다. 인라인(inline)과 블록(block)이 있다.
인라인 요소는 요소 다음에 새로운 줄이 없다.
여러개의 줄을 만들어도 같은 줄에 있을것이다.
예를들어 a와img태그가 있다.
블록요소는 뒤에 새로운 줄이 있다.
대부분의 html태그들이 사용하는 요소이다.
backend