Question

只有当鼠标指针触摸标题或点击身体的任何部位时，我才需要显示标题背景颜色。

否则我需要一个隐藏的标题背景颜色。

<body>

    <div id="wrapper">

        <div id="header">
            <a  style="text-decoration:none" href="#" target="_blank">about.me</a>
            <button class="button">Log In </button>
            <button class="button">Create your page!</button>
        </div><!-- #header -->

        <div id="content">
          <div id="image">
               <center><img src="../../../../../wamp/www/check_php/IMG_9079.JPG"></center>
               <div class="clear_both" />&nbsp;</div>
               <div class="sub">
                <p align="center"><button class="button2">View my photos</button></p>
                <div class="clear_both" />&nbsp;</div>
                <p align="left">This is the power of a common man</p>
           </div> 
       </div><!-- #content -->


        <div id="footer">
           <p>Introduce yourself with a free, one-page website.
            <button class="button1">Get Started </button></p>
        </div><!-- #footer -->

    </div><!-- #wrapper -->

</body>

Answer 1

在你的html中添加一个类：

       <div id="header" class="header_navi">
            <a  style="text-decoration:none" href="#" target="_blank">about.me</a>
            <button class="button">Log In </button>
            <button class="button">Create your page!</button>
        </div><!-- #header -->

将此添加到您的css：

.header_navi {
     background-color:transparent;
}

.header_navi:hover {
     background-color:red;
}

标题背景颜色的外观和消失

1 个答案: