O que ja viu Div Background => Plano de fundo Formatacao Texto p => paragrafo bordas
Duas Classes juntas -ul class="ul_menu_horizontal amarelo">
form label {
padding:3px;
font:13px verdana;
display:block;
}
form label input{
background:gray;
border:2px solid;
}
form label input:focus {
border:2px solid green;
background: #fff;
}
Import ou Externo
< link rel="stylesheet" href="valvula.css" >
< style > @import "silicio.css";< /style >
Livro_css_na_web
Div
Menu Vertical
Menu Vertical
position
Exemplo Position
Exemplo Position Fixo
Relative
Absolut
fixed
Menu Horizontal
Menu Horizontal
=style type="text/css"=
#ul_menu_horizontal{
margin:0;
padding:0;
list-style-type:none;
width:100%;
}
#ul_menu_horizontal li {
float:left;
}
#ul_menu_horizontal li a {
display:block;
width:6em; /*espaco entre menus*/
text-decoration:none;
color:white;
background-color:purple;
padding:0.2em 0.6em;
border-right:1px solid white;
}
#ul_menu_horizontal li a:hover {
background-color:#ff3300;
}
#ul_menu_horizontal a.bullet {background:#69c url(../../../imagens/seta.gif) no-repeat right;}
#ul_menu_horizontal a.bullet:hover {background:#c7daec url(../../../imagens/seta.gif) no-repeat rigth;}
#ul_menu_horizontal li ul {
position:absolute; /* enconder sub*/
left: -1000em; /* esconder sub*/
width:10em;
margin:0;
}
#ul_menu_horizontal ul ul {
margin: -2.1em 0 0 10.1em;
}
#ul_menu_horizontal li:hover ul ul,#ul_menu_horizontal li.over ul ul {
left: -1000em;
}
#ul_menu_horizontal li:hover ul,#ul_menu_horizontal li li:hover ul,#ul_menu_horizontal li:hover ul,#ul_menu_horizontal li li.over ul {
left: auto;
}
=style
==body==
-ul id="ul_menu_horizontal">
-li>-a href="#">home-/a>-/li>
-li>-a href="#">1-/a>-/li>
-li class="ul_menu_horizontal_sub">-a href="#" class="bullet">Sub-menu-/a>
-ul>
-/ul>
-/li>
==final body==
Paragrafo DT
-dl>
-dt>Titulo-/dt>
-dd>texto escritodffdf-/dd>
-dt>Titulo-/dt>
-dd>texto escrito-/dd>
-/dl>