<head>
<style type="text/css">
body{
background-color : blue;
}
div{
color:yellow;
}
p{
color:red;
font-size:20px;
}
</style>
</head>
<body>
<div>
div 영역입니다!!
</div>
<p>
p 영역입니다!!
</p>
</body>
1.헤드와 헤드 사이에 style이라는 애를 만든다.
2.스타일 태그 사이에 애들을 꾸며준다.
<head>
<style type="text/css">
p{
color:red;
font-size:20px;
}
#textid{
color:blue;
}
.testclass{
}
</style>
</head>
<body>
<p>A</p>
<p id="textid">B</p>
<p>C</p>
<p class="testclass">D</p>
</body>
1.특별히 따로 꾸며주고 싶다면 id 값을 넣어주고
2.#(id)를 적어줘서 꾸며준다.
3.class를 찾을때는 .을 찍어줘야한다.
class와 id와 차이
일반적으로,
id같은 경우에는 단 하나만 들어가는 것이고
class는 여러개 들어가는 것이다.
<head>
<style type="text/css">
div{
border: 1px solid red;
padding:100px;
margin-left:100px;
}
</style>
</head>
<body>
<div>
이것은 div 입니더.
<div>
</body>
1.border: 1px(선 넓이) solid(일자선) red(색상);
2.padding:100px; => 100픽셀만큼 늘린다.
3.margin-left:100px;=>왼쪽 바깥쪽으로 100px 늘린다.
힘내자