2016-06-28 5 views
2

나는 Semantic-UI를 사용하고 있는데 나는이 같은 내 Form에게 경고 message을 추가하려고했다 :시맨틱 UI - 왜 양식 안에 메시지가 없습니까?

<form> 
    ...stuff... 
    <div class="ui warning message"> 
     <div class="header"> 
      Title of the message 
     </div> 
     Text of the message 
    </div> 
</form> 

을하지만 어떤 이유로 전혀 페이지에 게재되지 않았습니다. SemanticUI의 자체 내부 CSS 규칙이 양식 내부의 메시지를 명시 적으로 숨기기 때문에 그 사실을 알게 된 후에 만 ​​가능합니다. semantic.min.css에서 :

.ui.form .error.message, .ui.form .success.message, .ui.form .warning.message { 
    display: none; 
} 

왜인가요? 그것을 무시할 수 있습니까? 왜해서는 안되나요?

답변

4

잘하려고 당신의 CSS 만 formtag을 사용 할 수 .formclass에 사용하지 ,하지만 난 입니다을 추측합니다 error/success/warning 클래스는 양식 유효성 검사 메시지에 사용되므로 그 이유는 무엇입니까? 기본적으로 숨겨져 있습니다. 나는 특정 색상 클래스를 사용하기보다는 warning 하나를 사용하여 문제를 해결 :

<form> 
    ...stuff... 
    <div class="ui yellow message"> 
     <div class="header"> 
      Title of the message 
     </div> 
     Text of the message 
    </div> 
</form> 

이 완벽하게 작동하고 warning 한 시각적으로 구별 할 수있다.

-1

당신의 CSS를 .formclass에 쓰기하지만 당신은 그래서 당신은

나는 100 % 확실하지 않다,이

form .ui.error.message, 
form .ui.success.message, 
form .ui.warning.message { 
    display: none; 
} 
+0

당신은 심지어 내가 쓴 읽을 수 있나요? 죄송 합니다만, 불쾌감은 없지만 이것은 제 질문과 관련이 없습니다. 포인트 1 : CSS는 의미 론적 UI와 함께 제공되는 공식적인 CSS입니다. 제 CSS가 아닙니다. 게다가, 나는 그것을 숨기려고하지 않고있다. 나는 그 반대의 것을하려고 노력하고있다. CSS는 사실 정확하지 않습니다. 완벽하게 작동합니다 (내 메시지를 숨기는 것처럼 나를 귀찮게합니다.)) –

0

나는 또한 동일한 문제가있었습니다. 이미 답변이 있지만이 게시물을 방문하는 다른 사용자의 경우 :

<div> 클래스 "ui form error"로 끝내십시오.

예를 들면,

<div class="ui form error"> 
<form class="some class" method="POST" action="/some_acton"> 
..fields.. 
</form> 
</div> 

또는

<form class="ui form error your_class" method="POST" action="/some_action"> 
..fields.. 
</form>