0

テキストを光らせるコードをいくつか書きましたが、カーソルがテキストの上にあるときだけでなく、カーソルがテキストによって拡張された水平領域の上にあるときもテキストが光ります。これはなぜ発生し、カーソルがテキストの上にあるときにのみ光るようにするにはどうすればよいですか?

<!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>
4

2 に答える 2