2013-04-25 1 views
0

아래의 CSS를 h : outputText의 title 속성으로 덮어 쓰려고합니다.h : outputText에서 제목 속성 css를 재정의하는 방법

css: 

    <style type="css/text"> 

    .title 
    { 
     border : 1px solid #FF9933; 
     font-family : verdana; 
     font-size : 14px; 
     font-weight:normal; 
     color: #000000; 
     background-color:#fae6b0; 
     padding : 5px 5px 5px 5px"; 
    } 
</style> 

<h:outputText id="userName" 
      value="#{userBean.userName}" 
      title="#{userBean.userName}"/> 

    <h:outputText id="userAddress" 
      value="#{userBean.userAddress}" 
      title="#{userBean.userAddress}"/> 

아래 링크를 클릭하십시오. html의 title 속성을 변경하려고 시도했지만 정상적으로 작동합니다. richfaces에 같은 일을 적용하는 방법을

How to change the style of Title attribute inside the anchor tag?

.

+0

을 (수동으로 jQuery를 포함시킬 필요하지 않은 있도록, jQuery로 이미 배송 번들 RichFaces 버전을 사용하고 있는지 제공) title 속성에 스타일을 지정합니다 (팝업은 HTML의 일부가 아닙니다). – Makhiel

+0

이미 rich : tooltip을 사용하여 값을 표시했습니다. IE에서는 페이지를 렌더링하는 데 오랜 시간이 걸립니다. 그래서 모든 툴팁을 제거하고 title 속성을 사용합니다. title 속성은 css 간단합니다. 그래서 나는 표시 할 스타일을 개선하고 싶습니다. 그것을 바꾸는 다른 어떤 선택권. – newuser

답변

1

HTML 요소의 title 속성으로 표시된 도구 설명은 CSS에서 스타일을 지정할 수 없습니다. 스타일은 웹 브라우저에 의해 완전히 제어되며 클라이언트 운영 체제 플랫폼의 기본 툴팁 스타일로 표시됩니다. 그래서 예. 클라이언트가 Windows 7을 실행하면 도구 설명이 Windows 7 기본 스타일로 표시됩니다. 다시 말하지만, 컨트롤이 없습니다.

가장 좋은 방법은 title 속성을 마우스 오버/아웃시에 나타나거나 사라지는 완전한 HTML <div>으로 바꾸는 것입니다. 이렇게하면 일반적인 CSS 수단으로 스타일을 완전히 제어 할 수 있습니다. 이미 알고 있듯이 RichFaces는 정확히 <rich:tooltip> 구성 요소를 가지고 있습니다. 어떤 이유로 든 부족한 경우, 모든 title 속성을 자동으로 스타일 변경 가능 <div> 요소로 변환 할 다른 JS/jQuery 플러그인을 찾아 볼 수 있습니다. 그 중 하나는 qTip입니다. 당신이 필요로하는 것은 기본적으로 다음입니다 :

<h:outputScript name="scripts/jquery.qtip-1.0.0-rc3.min.js" target="head" /> 
<h:outputScript target="body">$("[title]").qtip();</h:outputScript> 

당신은 할 수 없습니다

관련 문제