!important

jquery mobile를 사용해서 css 작업을 하다 보니 간혹 먹히지 않는 태그들이 있다. 예를 들어 a 태그를 사용하면서 색상이나 폰트무게 등을 설정하려는데 적용이 되지 않는다.

이 때 !important 를 뒤에 붙여 주면 해결 된다.
예제 코드는 아래와 같다.

a{
color:#fff !important;
font-weight:normal !important;
}

a 태그에도 내가 원하는 색상과 폰트 무게를 적용할 수 있게 되었다.

그러나 바디에 백그라운드 칼라를 적용할 때 보통 아래와 같은 코드를 쓴다.

<style>
body{
background-color:lightblue;
}
</style>

 

그러나 jquery-mobile와 관련된 css가 삽입되어 있을 때는 위의 코드가 적용 되지 않는다. 아래의 코드를 사용하면 모바일 페이지 바디의 배경 칼라를 적용할 수 있다.

<style>
.ui-page{
background-color:lightblue;
}
</style>