Tu mejor ayuda para aprender a hacer webs www.desarrolloweb.com
$(document).ready(function(){ //selectores ancestor descendant $("p i").css("color", "#66F"); $("table.mitabla td").css("background-color", "#55ff00"); //selectores parent > child $("p.parraforojo > b").css("color", "red"); $(".mitd > *").css("border", "1px solid #ff9900"); //selectores prev + next $("i + b").css("font-size", "40px"); $(".elemlista + li").css("opacity", 0.2); //selectores prev ~ siblings $("#a2 ~ div.clase").css("font-size", "180%"); $("#miparrafo ~ table").css("border", "3px dotted #dd6600"); }); </script> </head> <body> <p class="parraforojo"> <i>Hola</i> <b>esto</b> es un <b>párrafo</b> rojo <i>donde</i> he <b>puesto</b> unas <b>negritas</b> </p> <p class="parraforojo">Otro <b>con</b> clase class="parraforojo" <span class="unspan"><b>(esto está dentro de unspan B, no depende directamente -no child- del párrafo)</b></span></p> <p>Hola <b>esto</b> es otro <b>párrafo </b>para <i>poner</i> otras <b>negritas</b></p> <p>hola!!!</p> <table border=1> <tr> <td><i>Tabla cualquiera</i></td> <td>Esta tabla <b>no tiene</b> class de <b>CSS</b></td> </tr> </table> <p id="miparrafo">Este es el párrafo con id="miparrafo"</p> <table class="mitabla" border=1> <tr> <td colspan=2>Esta tabla tiene una <b>clase CSS</b></td> </tr> <tr> <td><i>class="mitabla"</i></td> <td class="mitd">Y este <b>td</b> le he puesto <i>class="mitd"</i> <span>Una cosa<span>otra cosa</span></span></td> </tr> </table> <p><b>Párrafo</b> que tiene alguna <b>negrita</b> e <span class="algo"><i>itálica</i></span> para seleccionar</p> <div> <div id="a1">hola</div> <div id="a2">dos</div> <div id="a3">3</div> <span>Cuatro (no es un div)???</span> <div id="a4" class="clase">Cuatro de verdad</div> </div> <ul> <li>Elem 1</li> <li class="elemlista">Elem 2</li> <li>Elem 3</li> <li>Elem 4</li> <li class="elemlista">Elem 5</li> <li class="elemlista">Elem 6</li> <li>Elem 7</li> </ul> </body> </html>
Manual de Jquery: http://www.desarrolloweb.com/manuales/manual-jquery.html © Los manuales de DesarrolloWeb.com tienen el copyright de sus autores. No reproducir sin autorización.
54