센차 터치 2 : 만들

Question

내가 CSS 스타일에 배경 이미지를 추가하여 내 자신의 체크 박스를 만들기 위해 노력하고있어 투명 또는 숨겨진 체크 박스 :

.x-input-el + .x-field-mask { 
    background-image:url(../images/checkbox-inactive.png); 
} 

및

.x-input-el:checked + .x-field-mask::after { 
    background-image:url(../images/checkbox-active.png); 
} 

모든 꽤 많이 간다 그래,하지만 네이티브 블루 체크 상자를 제거 할 수는 없지만 (나는 그 색을 바꿀 수 있음). 체크 박스를 제거하는 적절한 방법은 무엇입니까?

나는 글꼴 크기를하게되면 : 0 또는 여기 app.css에서 뭔가를 오버라이드 (override) :

.x-checkmark-base, .x-field-checkbox .x-field-mask::after, .x-field-radio .x-field-mask::after, .x-select-overlay .x-item-selected.x-list-item::after { 
position: absolute; 
top: 0; 
right: 10px; 
bottom: 0; 
content: '3'; 
font-family: 'Pictos'; 
font-size: 1.6em; 
text-align: right; 
line-height: 1.6em; 
} 

, 나는 체크 박스를 확인할 수 없습니다 (이 체크인시 활성 상태로 표시되지 않습니다). 이 문제를 해결하는 방법? 화면에서 체크 박스를 숨기고 나머지는 모두 그대로 유지하려면 어떻게해야합니까? 감사합니다.

Answer 1

GCyrillus, 여기 해결책입니다.

.x-checkmark-base, .x-field-checkbox .x-field-mask::after, .x-field-radio .x-field-mask::after, .x-select-overlay .x-item-selected.x-list-item::after { 
    content:'' 
} 

(일부 클래스는 아마도 무효화 될 수 있음) 감사합니다!

Answer 2

체크 박스 + 라벨을 사용하면 체크 박스와 스타일 라벨을 숨길 수 있습니다.
위치 : 고정 + 왼쪽 : 멀리; 그것을 할 수도 있습니다. 당신의 배경 이미지를 저장할 수 http://codepen.io/gcyrillus/pen/BFIno

label { 
    display:inline-block; 
    color:tomato 
} 
label:before { 
    content:'✗'; 
    border:solid; 
    border-radius:3px; 
    padding: 0 0.15em; 
} 
input:checked + label { 
    color:turquoise; 
} 
input:checked + label:before { 
    content:'✓'; 
} 
/* hide hecbox */ 
[type="checkbox"] { 
    position:fixed; 
    left:-9999px; 
} 

<p> 
    <input type="checkbox" id="ckckbx"/> 
    <label for ="ckckbx"> lorem</label> 
</p> 

라벨 또는 의사 :

테스트를주십시오.