특정태그만 선택/ 콘텐트가리기 / 콘텐트를 이미지로 대체/코드 집중화

ul>li>a에서 <a>만 선택해서 적용하기

모두 동일하게 red컬러적용됨

하지만 나중에 바뀔 수도있고 태그가 많으니까 클래스명으로만 지정하는것으로 바꿈 

ul생략한 최종 코드

적용된모습

background: url("") no-repeat 

 

콘텐트가리기 overflow: hidden

블록은 오른쪽으로커지기때문에 텍스트를 왼쪽으로 밀어내는게 일반적이다.

text-indent로 밀어내도 보이는 콘텐트를 완전히 가리기 위해 overflow:hidden 처리를한다.

마이페이지글자가 사라졌다.

텍스트를 이미지로 대체하기

완료된 모습

반복코드 줄이기 : 집중화

class이름에 button을 추가하고 css에서 집중화한다. (반복코드 없애기)

집중화를 위해 클래스명 추가

반복코드없앤 모습

코드 우선순위 적용 !important;

---

각 선택된 코드가 다르다.