CSS관련 잡다

ㅇ!important

CSS는 원래 cascading이 되는데 위치에 따라서 덮어 쓰지만 !important 를 쓰면 최상위 선언한게 재정의 안 되서 안 바뀜

* 테스트 하려면 브라우저 캐쉬 비워가면서 테스트 해야 함

[style.css]

.box {border:3px solid #0f0 !important; margin:3px}

[test.html]

<!DOCTYPE html>

<html>

<head>

<title>Insert title here</title>

.box {border-color:red}

</style>

</head>

<body>

</body>

</html>

ㅇ장치에 따라서 스타일 다르게 하기(스크린, 프린트 할 때 다르게 나옴)

.menu {background-color : #ff0;}

.main {width : 400px ; height : 500px ; border : 10px solid #f00;}

@media print{

.menu {display : none;}

.main {width : 400px ; height : 500px ; border : 10px dashed #00f;}

}

</style>

ㅇ단위

- px는 장치마다 해상도에 따라 크기가 다르게 보일 수 있다.

- %,em 이 상대적인 크기이므로 이 단위를 쓰는게 좋다. 원하는대로 잘 안 나오긴 한다..

ㅇText

- text-overflow : clip | ellipsis -> 넘어갈 경우 ... 처리 하거나 잘라 내기

우물 안 강멍멍이