2016-09-21 2 views
0

mkdocs 초보자입니다. 캡션을 이미지에 추가하고 CSS 스타일을 사용하여 짧은 여백을 사용하십시오. 내가mkdocs 및 markdown : base.css가 사용자 정의 CSS를 덮어 씁니다

![](../img/some.png) 
: my sub caption 

를 사용, 그래서 만약 내가 HTML에

<figure><img ...><figcaption>... 

를 얻을 수 있습니다, 파이썬 - makdown 확장 "캡션"를 설치 할 수 있었다. Unfornutately 간격 (CSS : 여백) 큰 그래서 나는 CSS 파일을 기본값을 제거하는 포함되어 있습니다. 이제 내 브라우저에서 검사하면 base.css가 내 스타일을 덮어 쓰게되므로 여백이 기본값으로 유지됩니다. base.css 스타일을 내 스타일로 덮어 쓸 수 있습니까? !

figure img {margin-bottom: 0px !important;} 

을하지만 당신은 img 요소를 검사하기 위해 브라우저의 개발자 도구를 사용하는 경우 나는

+0

! 내 자신의 CSS 파일에서 중요한 작업은 해결책이 될 수 있습니다 ... –

+0

이유는 계단식 스타일 시트의 * 계단식 * 부분과 관련이 있습니다. 당신은 자신의 스타일을 어떻게 포함 시켰는지 말하지 않았으므로, 당신이 다른 것을해야한다고 말할 수는 없습니다. 일반적인 안내는 [CSS 우선 순위] (http://stackoverflow.com/a/667585/866026)를 참조하십시오. – Waylan

+0

당신에게 감사드립니다, 내가 알아 내려고 노력하겠습니다. 나는 mkdocs.yml 안에있는 extra_css에있는 항목과 함께 mkdocs를 사용하고있다. 내 CSS 파일에서 위의 진술과 생각,이 base.css (div.col-md-9 img) 스타일을 덮어 씁니다 있지만 그림 img 계단식 계층 구조에서 올바른 위치 않을 것으로 보인다. –

답변

1

... 왜 이해가 안 : 난 내 의견에 썼던 것처럼

, 중요한 보장 덮어 쓰기. ..

enter image description here

당신은 img이 규칙으로 정의되어 있음을 알 수 div.col-md-9 img. 즉, col-md-9 클래스의 div 아래의 모든 img 태그.

원본 규칙은 0012이라는 특수성을 위해 하나의 클래스 속성과 두 개의 요소 이름을 사용합니다 (CSS Precedence에서 설명 됨). 당신은 동등하거나 더 높은 특이성의 무언가가 필요합니다. 그러나 figure img0002 만 제공합니다.

enter image description here

나는 확실히 다른 다양한 순열뿐만 아니라 작업 결과를 줄 것이다 해요 :

가를 무시하려면, 당신은 특이성의 최소한 같은 수준이 필요합니다. 그러나 우리에게는 실용적인 해결책이 있습니다. "inspect"도구 덕분에 매우 빠르고 쉽게 해결할 수있었습니다.

+0

설명해 주셔서 감사합니다! 항상 css의이 부분을 ... –

관련 문제