Script bello e pronto per le linguette

**ratlook** · 22-01-2011, 18:19

ciao a tutti, qualcuno conosce un codice bello e pronto per realizzare delle schede richiamabili con linguette?
tipo questo: http://www.mcdigit.it/schermo-proiez...0cm-p-293.html

**.:KiRoS:.** · 23-01-2011, 14:33

Qua puoi trovare qualche spunto
http://css.html.it/articoli/leggi/41...abs-con-i-css/

**ratlook** · 23-01-2011, 18:15

qualche altra soluzione bella e pronta?

**carlomarangoni** · 23-01-2011, 18:24

codice:

<!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></title>
<style type="text/css">
<!--
    body {
        margin:0;
        padding:0;
        font: bold 11px/1.5em Verdana;
}

h2 {
        font: bold 14px Verdana, Arial, Helvetica, sans-serif;
        color: #000;
        margin: 0px;
        padding: 0px 0px 0px 15px;
}
img {
border: none;
}

    #tabs1 {
      float:left;
      width:100%;
          background:#F4F7FB;
      font-size:93%;
      line-height:normal;
          border-bottom:1px solid #BCD2E6;
      }
    #tabs1 ul {
          margin:0;
          padding:10px 10px 0 50px;
          list-style:none;
      }
    #tabs1 li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabs1 a {
      float:left;
      background:url("tableft1.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
    #tabs1 a span {
      float:left;
      display:block;
      background:url("tabright1.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#627EB7;
      }
    #tabs1 a span {float:none;}
    #tabs a:hover span {
      color:#627EB7;
      }
    #tabs1 a:hover {
      background-position:0% -42px;
      }
    #tabs1 a:hover span {
      background-position:100% -42px;
      }

      #tabs1 #current a {
              background-position:0% -42px;
      }
      #tabs1 #current a span {
              background-position:100% -42px;
      }
    #tabs2 {
      float:left;
      width:100%;
      font-size:93%;
      line-height:normal;
          border-bottom:1px solid #84776B;
      }
    #tabs2 ul {
          margin:0;
          padding:10px 10px 0 50px;
          list-style:none;
      }
    #tabs2 li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabs2 a {
      float:left;
      background:url("tableft2.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
    #tabs2 a span {
      float:left;
      display:block;
      background:url("tabright2.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#84776B;
      }
    #tabs2 a span {float:none;}
    #tabs2 a:hover span {
      color:#74675B;
      }
    #tabs2 a:hover {
      background-position:0% -42px;
      }
    #tabs2 a:hover span {
      background-position:100% -42px;
      }

      #tabs2 #current a {
              background-position:0% -42px;
      }
      #tabs2 #current a span {
              background-position:100% -42px;
      }
-->
</style>
        </head>

        <body>
                <div id="tabs2">
                        <ul>
<li id="current"><span>Home</span>[*]<span>Products</span>[*]<span>Services</span>[*]<span>Support</span>[*]<span>Order</span>[*]<span>News</span>[*]<span>About</span>[/list]
                </div>
        </body>
</html>

Discussione: Script bello e pronto per le linguette

Strumenti discussione

Ricerca discussione

Visualizza

Script bello e pronto per le linguette

Permessi di invio