[XML] CSS 기초

CSS(Cascading Style Sheets)란 ? ? ?

 웹페이지를 꾸미려고 작성하는 코드입니다.

 

 

 

↓↓↓   CSS 알아보기   ↓↓↓

실습을 위해 간단하게 xml 파일을 만들어 보았습니다.

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type = "text/css" href = "practice.css"?>

xml 위에 부분에 css 링크도 같이 걸어주었습니다.

 

 

자세한건 아래 링크에서 확인

https://yyyeji.tistory.com/69?category=1305455 

[XML] XML에 CSS 적용하기

 

 

 

 

CSS 파일에 코드를 작성하기 전에는 아래 화면처럼 한 줄로 뜹니다.

 

 

CSS를 적용해 보도록 하겠습니다.

practice.css

CSS 코드를 하나하나 자세히 살펴보겠습니다.

 

to{}, from{}, contents{}는 각각의 tag{} 입니다.

to{
	display: block;
    font-weight: bold;
    text-align: left;
}

display: block은 to 부분을 block으로 구분하면서 to가 끝나게 되면 줄바꿈이 됩니다.

font-weight: bold는 글씨가 볼드체(굵고 진한 글꼴)로 화면에 나오게 해줍니다.

text-align: left는 글씨를 왼쪽에 배치해줍니다.

(text-align: right는 오른쪽 배치)

 

 

다음으로 contents tag를 살펴보겠습니다.

contents{
    display: block;
    color: pink;
    font-weight:bold;
    font-style: italic;
    text-align: left;
    margin: 5%;
}

color: pink는 글씨에 색이 입혀져서 출력됩니다.

font-style: italic은 글씨가 이탈릭체로 출력됩니다.

text-align는 block으로 된 부분에서 왼쪽에 출력됩니다.

margin: 5%는 상하좌우 5% 씩 띄어져서 출력됩니다.

 

 

 

아래는 CSS가 적용된 화면입니다.

 

 

◡̈