Forum » Izdelava spletišč » CSS button - hover
CSS button - hover
Klemen1602 ::
Pozdravljeni!
Ne razumem funkcije hover pri html/css oblikovanju, zato bi prosil za pomoč.
Tukaj sta obe kodi.
Hvala za pomoč!
Klemen
Ne razumem funkcije hover pri html/css oblikovanju, zato bi prosil za pomoč.
Tukaj sta obe kodi.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Nekaj ...</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="login_box">
<div class="login_logo">Login box
</div>
<div class="login_content">
<form>
<input type="text" name="username" value="Your username" />
<br />
<input type="text" name="password" value="Your password" />
<br />
<input class="button" type="submit" name="login" value="Login" />
<input class="button" type="submit" name="cancel" value="Cancel" />
</form>
</div>
<div class="login_footer">
Vse pravice pridržane. (C)
</div>
</div>
</body>
</html>/* CSS Login page */
/* Vse skupaj damo v okvir */
.login_box {
background:#F2F2F2;
width:300px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
border:1px solid gray;
margin-left:auto;
margin-right:auto;
}
/* Logo je v svoji vrstici */
.login_logo {
background:#FFF;
width:300px;
height:18px;
border-bottom:thin solid gray;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:16px;
text-align:center;
padding:inherit;
}
/* Vsebina tega spodnjega okvirja */
.login_content {
text-align:center;
padding:5px;
width:290;
height:272;
}
/* Stil noge */
.login_footer {
background:#FFF;
width:298px;
height:10px;
border-top:thin solid gray;
font-family:Verdana, Arial, Helvetica, sans-serif;
color:gray;
font-size:9px;
text-align:center;
padding:1px;
}
.button {
border:1px solid gray;
height:16px;
font-size:10px;
color:black;
}
.button a:hover {
border:1px solid gray;
height:18px;
font-size:14px;
color:black;
}Hvala za pomoč!
Klemen
- spremenil: Klemen1602 ()
urosz ::
Lastnosti, ki jih določiš v hover se aktivirajo, ko greš z miško čez povezavo.
V tvojem primeru pa .button a:hover ne more delovati, ker to pomeni hover za tiste povezave, ki so znotraj elementa s class-om button. Kar pa v tvojem primeru v html ni.
V tvojem primeru pa .button a:hover ne more delovati, ker to pomeni hover za tiste povezave, ki so znotraj elementa s class-om button. Kar pa v tvojem primeru v html ni.
Klemen1602 ::
Kako naj bi potem takem izgledala koda? Hvala!
Če prav razumem, če bom imel gumb potem ne bo deloval hover, če bom imel nekaj link, potem bo hover deloval?
Če prav razumem, če bom imel gumb potem ne bo deloval hover, če bom imel nekaj link, potem bo hover deloval?
Zgodovina sprememb…
- spremenil: Klemen1602 ()
urosz ::
Tako je
Tako bi moralo delovati:
Tako bi moralo delovati:
<div class="login_content">
<form id="obrazec">
<input type="text" name="username" value="Your username" />
<br />
<input type="text" name="password" value="Your password" />
<br />
<a href="#" onclick="document['obrazec'].submit()">Login</a>
</form>
</div>
.login_content a {
border:1px solid gray;
height:16px;
font-size:10px;
color:black;
}
.login_content a:hover {
border:1px solid gray;
height:18px;
font-size:14px;
color:black;
}
Zgodovina sprememb…
- spremenil: urosz ()
Vredno ogleda ...
| Tema | Ogledi | Zadnje sporočilo | |
|---|---|---|---|
| Tema | Ogledi | Zadnje sporočilo | |
| ! | Vse, kar ste si želeli vprašati o CSS, pa si niste upali. (strani: 1 2 3 4 … 23 24 25 26 )Oddelek: Izdelava spletišč | 348216 (7353) | sunniegoldie |
| » | Prikaz strani na različni resoluciji-JoomlaOddelek: Izdelava spletišč | 1958 (1686) | kr?en |
| » | Ocena? Kako bi dodal podstrani?Oddelek: Pomoč in nasveti | 911 (776) | shadeX |
| » | Kontaknti obrazec - potrebujem pomočOddelek: Programiranje | 1165 (887) | cobrica |
| » | CSS background-image in IE6?Oddelek: Izdelava spletišč | 3092 (2958) | Road Runner |