Difference between revisions of "Template:GreatBay SCIE/CSS/navbar"
| Line 1: | Line 1: | ||
| − | |||
.navbar { | .navbar { | ||
| − | margin:-10px auto; | + | /*margin:-10px auto;*/ |
| − | + | ||
/* position: fixed; */ | /* position: fixed; */ | ||
| + | top:0; | ||
} | } | ||
.navbar ul { | .navbar ul { | ||
/*border-radius:15px;*/ | /*border-radius:15px;*/ | ||
/*background:linear-gradient(to bottom,#fad4f7,#e7b8df);*/ | /*background:linear-gradient(to bottom,#fad4f7,#e7b8df);*/ | ||
| − | + | width: 100%; | |
background-color:#fad4f7; | background-color:#fad4f7; | ||
| − | + | padding:0px 40px 0px 0px; | |
| − | display:inline-table; | + | display:inline-table; |
position:relative; | position:relative; | ||
box-shadow:1px 1px 3px rgb(255, 255, 255); | box-shadow:1px 1px 3px rgb(255, 255, 255); | ||
color:#000; | color:#000; | ||
list-style: none; | list-style: none; | ||
| + | text-align: center; | ||
} | } | ||
/*.navbar ul ul{ | /*.navbar ul ul{ | ||
| Line 32: | Line 32: | ||
opacity: 0%; | opacity: 0%; | ||
overflow: hidden; | overflow: hidden; | ||
| − | |||
transition: max-height 0.3s ease; | transition: max-height 0.3s ease; | ||
} | } | ||
| Line 44: | Line 43: | ||
.navbar ul li { | .navbar ul li { | ||
| − | float:left; | + | float: left; |
| + | margin: auto; | ||
position:relative; /*这行无论如何都不要动*/ | position:relative; /*这行无论如何都不要动*/ | ||
/*z-index: 0;*/ | /*z-index: 0;*/ | ||
transition: all 0.25s ease-out; | transition: all 0.25s ease-out; | ||
} | } | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
.navbar ul li:hover { | .navbar ul li:hover { | ||
background-color:#e6b7e6; | background-color:#e6b7e6; | ||
border-radius:45px; | border-radius:45px; | ||
} | } | ||
| − | |||
.navbar ul li a { | .navbar ul li a { | ||
| − | display: | + | display:inline-table; |
padding:15px 40px; | padding:15px 40px; | ||
color:#000; | color:#000; | ||
text-decoration:none; | text-decoration:none; | ||
font-family:"Calibri"; | font-family:"Calibri"; | ||
| − | font-size:130%; | + | font-size: 130%; |
| − | transition:color 0.25s; | + | transition: color 0.25s; |
| − | text-align: center | + | text-align: center; |
list-style: none; | list-style: none; | ||
} | } | ||
Revision as of 05:36, 2 July 2021
.navbar {
/*margin:-10px auto;*/ /* position: fixed; */ top:0;
} .navbar ul {
/*border-radius:15px;*/ /*background:linear-gradient(to bottom,#fad4f7,#e7b8df);*/ width: 100%; background-color:#fad4f7; padding:0px 40px 0px 0px; display:inline-table; position:relative; box-shadow:1px 1px 3px rgb(255, 255, 255); color:#000; list-style: none; text-align: center;
} /*.navbar ul ul{
display:none;
}*/ .navbar ul::after {
content:""; display:block; clear:both;
}
.navbar ul li ul {
/*overflow: hidden;*/ position: absolute; max-height: 0px; opacity: 0%; overflow: hidden; transition: max-height 0.3s ease;
}
.navbar ul li:hover > ul {
opacity: 80%; max-height: 500px; display: block; transition: max-height 0.3s ease-in-out;
}
.navbar ul li {
float: left; margin: auto; position:relative; /*这行无论如何都不要动*/ /*z-index: 0;*/ transition: all 0.25s ease-out;
} .navbar ul li:hover {
background-color:#e6b7e6; border-radius:45px;
} .navbar ul li a {
display:inline-table; padding:15px 40px; color:#000; text-decoration:none; font-family:"Calibri"; font-size: 130%; transition: color 0.25s; text-align: center; list-style: none;
} .navbar ul li a:hover {
color:rgb(255, 255, 255); list-style: none;
}
.navbar ul li ul li a {
color:rgb(0, 0, 0);
} .navbar ul li ul li:hover a{
color:rgb(255, 255, 255)
}
/*.navbar ul ul {
background:linear-gradient(to bottom,#fad4f7,#e7b8df); border-radius:1; position:absolute; top:100%;
}*/
.navbar ul li ul li {
float:none; border-top:1px solid #e6c5ee; border-bottom:1px solid #e6c5ee; color:#000;
}