[CSS] 기본문법과 속성 알아내기

CSS (Cascading Style Sheets)

 

<h1><a href="index.html"><font color="red;text-decoration:underline">WEB</font>

 

1. 

<h1><a href="index.html"><font color="red;text-decoration:underline">WEB</font>

*font : 정보는x 오로지 디자인적 요소

text-decoration:underline : 텍스트 밑줄

스타일 속성을 이용해 바꾸려는 부분에만 적용시켰다.

 

<style>
a{
    color: red;
    text-decoration: none;
    }
</style>

2.

<style> : css 코드가 시작된다는 뜻
a{
    color: red; : 효과가 끝났을때 ; 를 써준다.
    text-decoration: none;  : 텍스트 효과 없음
    }
</style>

*<style> 태그(css) 를 이용하여 css 문법을 통해 표현했다.

 

>> 1번과 2번은 같다 다만 2번이 일괄적으로 적용되고, 유지보수가 쉽고 가독성 있게 짜여진 것이다.

 

css 문법 

<style>
	a{
    	color: red;
        text-decoration: none;
    }
</style>

 

<style>
a{
     color: red;
        text-decoration: none;
    }
</style>

a{} : seleator 선택자

color: red;  : declaration 효과

효과는 또 두가지로 분류할수 있다.

color : property 속성red : value 값

 

---

 

 

<style>
	a{
    	color: red;
        text-decoration: none;
    }
    h1{
    	font-size: 45px;
        text-align: center;
    }
</style>
<h1><a href="index.html"><font color="red; text-decoration: underline">WEB</font>

 

<style>
a{
     color: red;
        text-decoration: none;
    }
    h1{
     font-size: 45px; : 글꼴 사이즈 
     text-align: center; : 텍스트 정렬 방향 중앙 
    }
</style>
<h1><a href="index.html"><font color="red; text-decoration: underline">WEB</font>

 

** search tip : css text size property, css text center property