Recursos i serveis per a la comunicació

Comparteix:

Menú amb pestanyes

Per organitzar els continguts per pestanyes

El resultat

Vine i ens coneixerem

Jornades de Portes Obertes


Al llarg del curs, les escoles i facultats de la UPC obren les seves portes i instal·lacions per convidar-te a conèixer en detall els estudis que ofereixen, les sortides professionals que tenen i els seus espais i laboratoris més destacats. Tens dubtes sobre quina carrera triar? Vols visitar el teu futur campus? Doncs no et perdis la propera JPO!

Tria la teva JPO!



No t'ho perdis

T'apuntes a la següent activitat?


Vols entrar a una Sala Blanca? O experimentar una smart room? Vols aprendre a navegar amb la posició de les estrelles? La Universitat Politècnica de Catalunya t'ofereix un ampli ventall d'activitats - xerrades, tallers, exposicións, laboratoris remots - que t'acostaran a la ciència i a la tecnologia d'una manera pràctica i amena.

Apropa't al món politècnic!




Pas a pas

  1. Hem de copiar i enganxar el codi següent a la pàgina del Genweb on volem incorporar el menú de pestanyes. No oblideu a editar la pàgina amb la visualització del Codi Font.

    <dl class="enableFormTabbing">

    <dt id="fieldsetlegend-primer">Això és el títol de la pestanya, el nom del menú</dt>

    <dd id="fieldset-primer">

    <h3>Titular del contingut [opcional]</h3>

    <p>Aquí hi posem el text del contingut de la pestanya</p>

    </dd>

    </dl>
     
  2. Repetir l'estructura HTML marcada en negreta tants cops com pestanyes necessitem.
  3. De l'estructura que hem anat repetint, haurem de modificar els identificadors de les etiquetes <dt> i <dd> per tal d'anar aparellant les pestanyes amb el seu corresponent contingut. Aquests identificadors han de ser únics i no es poden repetir:
    <dt id="fieldsetlegend-primer">Això és el títol de la pestanya, el nom del menú</dt>

    <dd id="fieldset-primer">
    [...]
    <dt id="fieldsetlegend-segon">Això és el títol de la pestanya, el nom del menú</dt>

    <dd id="fieldset-segon">
    [...]
    <dt id="fieldsetlegend-tercer">Això és el títol de la pestanya, el nom del menú</dt>

    <dd id="fieldset-tercer">

     

  4. Escriure el contingut real de les nostres pestanyes i el seu contingut dins de l'etiqueta <dt> i <dd> respectivament.