zmiana koloru przycisku zaokrąglonych rogów za pomocą CSS
dzięki z góry!
udało mi się wykonać zaokrąglony przycisk narożny za pomocą CSS. Lubię poruszać myszką po przycisku, a cała rzecz zmienia swój kolor, nie tylko wewnętrzny div. plz help!
moje założenie jest takie, że powinien mieć jakiś javascript z onmouseover = "", prawda?
tutaj jest strona:http://biozenconsulting.com/new/
(również, jak pozbyć się małych pudełek, które pojawiają się w prawym rogu podczas przeglądania w IE8 i Chrome?)
to jest kod HTML:
<div class="nav_menu" onclick="location.href='index.htm'">
<b class="top_menu"><b class="top_menu1"><b></b></b><b class="top_menu2"><b></b></b><b class="top_menu3"></b><b class="top_menu4"></b><b class="top_menu5"></b></b>
<div class="top_menufg">
<!-- content goes here -->
Home
</div>
<b class="top_menu"><b class="top_menu5"></b><b class="top_menu4"></b><b class="top_menu3"></b><b class="top_menu2"><b></b></b><b class="top_menu1"><b></b></b></b>
</div>
a oto CSS:
.nav_menu {
text-align: center;
color: #353535;
font-size: 20pt;
font-family: Verdana, Geneva, sans-serif;
float: left;
width: 33%;
}
#about {
margin: 0 .5% 0 .5%;
}
<!-- For rounded boxes -->
.top_menu {
display:block
overflow: hidden;
}
.top_menu *{
display:block;
height:1px;
overflow:hidden;
font-size:.01em;
background:#AAAAAA
}
.top_menu1{
margin-left:3px;
margin-right:3px;
padding-left:1px;
padding-right:1px;
border-left:1px solid #AAAAAA;
border-right:1px solid #AAAAAA;
background:#AAAAAA
}
.top_menu2{
margin-left:1px;
margin-right:1px;
padding-right:1px;
padding-left:1px;
border-left:1px solid #AAAAAA;
border-right:1px solid #AAAAAA;
background:#AAAAAA
}
.top_menu3{
margin-left:1px;
margin-right:1px;
border-left:1px solid #AAAAAA;
border-right:1px solid #AAAAAA;
}
.top_menu4{
border-left:1px solid #AAAAAA;
border-right:1px solid #AAAAAA
}
.top_menu5{
border-left:1px solid #AAAAAA;
border-right:1px solid #AAAAAA
}
.top_menufg{
background:#AAAAAA
}
.top_menufg:hover{
background-color: #888888;
cursor: pointer;
}
<!-- For rounded boxes -->