커서가 텍스트 위에 있지 않을 때도 텍스트가 번쩍입니다.

텍스트가 반짝이도록 코드를 작성했지만 커서가 텍스트 위에있을 때뿐만 아니라 커서가 텍스트로 확장 된 수평 영역 위에있을 때 텍스트가 반짝입니다. . 왜 이런 일이 일어나고 커서가 텍스트 위에있을 때만 반짝 거릴 수 있습니까?커서가 텍스트 위에 있지 않을 때도 텍스트가 번쩍입니다.

<!DOCTYPE html> 
<html> 
<head> 
    <title>tTEXT</title> 
</head> 
<link rel="stylesheet" type="text/css" href="styles.css"/> 
<body> 
<style> 
@font-face 
{ 
    font-family: ralewaythin; 
    src: url('Cantarell-Regular.ttf') 
} 
.backgroundimage 
{ 
    background-position: center; 
} 
.text-glow-hover-with-delay 
{ 
    color: black; 
    -webkit-transition: text-shadow 0.15s; 
} 

.text-glow-hover-with-delay:hover 
{ 
    text-shadow: 0 0 10px #4682b4; 
} 
.head 
{ 
    font-family: ralewaythin; 
    color: black; 
    font-size: 75px; 
    -webkit-text-stroke: 1px; 
} 
</style> 
    <div class="text-glow-hover-with-delay"> 
     <div class="head">TEXT</div> 
    </div> 
</body> 
</html>

출처

2013-06-26 pranavsharma

전체 div를 선언했기 때문입니다. 당신은 빛을 낼 텍스트/요소를 지정해야합니다. 다음은 span 태그를 사용하여 특정 텍스트에 광선 효과를 설정하는 예제입니다. 헤더 텍스트를 발광 시키거나 다른 태그 만 원하면 h1 요소와 함께 사용할 수 있습니다.

http://jsfiddle.net/g5EbU/1/

<span class="text-glow-hover-with-delay" >GLOWING TEXT</span>

난 당신의 코드를 변경해야하지 않았다

, 그냥 클래스에 어디에. 여기에 코드가 있습니다

.text-glow-hover-with-delay 
{ 
color: black; 
-webkit-transition: text-shadow 0.15s; 
}

이 정보가 도움이되기를 바랍니다. 수업을 다시하고 헤더 태그 나 할 수있는 것을 사용해야하는 경우.

출처

2013-06-26 17:16:40 Matt

답변으로 표시해 주셔서 감사합니다! 귀하의 사이트와 함께 행운을 빌어 요! – Matt

당신의 텍스트는 기본적으로 display:block이있는 <div>에 있습니다. 해당 요소를 단어만큼만 크게하려면 <span>으로 변경하거나 display:inline-block으로 지정하십시오.

출처

2013-06-26 17:12:00

'인라인 블록'방법의 예 : http://jsfiddle.net/NUqhw/1/ – showdev

커서가 텍스트 위에 있지 않을 때도 텍스트가 번쩍입니다.

답변

관련 문제