Skip to content

HTML & CSS

12 Topics 96 Posts

This category can be followed from the open social web via the handle [email protected]

Subcategories


  • 4 20
    4 Topics
    20 Posts
    BaptisteB
    <p style="text-align:center;"><img alt="html2.png" src="<base_url>/applications/sslimageproxy/interface/image.php?url=http://webdesy.com/webdesy-wp/wp-content/uploads/2012/01/html2.png"/></p> <p style="text-align:center;"> </p> <p><span style="font-family:verdana, geneva, sans-serif;">Vous avez toujours voulu créer votre page web? Et bien pour la créer il faut tout d'abord s'instruire! Et pour s'instruire il faut lire, et c'est dans ce topic que vous allez découvrir les balises html ! </span></p> <p><span style="font-family:verdana, geneva, sans-serif;">Les balises html c'est quoi? Ce sont les "codes" qui vont définir la structure de votre page ! </span></p> <p><span style="font-family:verdana, geneva, sans-serif;">Ici vous aurez donc les balises fondamentales pour votre site web !</span></p> <p> </p> <p><strong><u><span style="font-family:verdana, geneva, sans-serif;">Pour le document : </span></u></strong></p> <ul><li><span style="font-family:verdana, geneva, sans-serif;"><html></html> : définit un document html</span> </li><li><span style="font-family:verdana, geneva, sans-serif;"><body></body> : définit le corps du document</span></li> </ul><p><strong><u><span style="font-family:verdana, geneva, sans-serif;">Pour vos titres : </span></u></strong></p> <ul><li><span style="font-family:verdana, geneva, sans-serif;"><h1></h1> </span> </li><li><span style="font-family:verdana, geneva, sans-serif;"><h2></h2></span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><h3></h3> </span></li> <li><span style="font-family:verdana, geneva, sans-serif;">Et ainsi de suite jusqu'à <h6></6></span></li> </ul><p><em><span style="font-family:verdana, geneva, sans-serif;">Ces balises définissent la hauteur de votre texte, elles servent donc de mise en page pour le texte ! </span></em></p> <p> </p> <p><u><strong><span style="font-family:verdana, geneva, sans-serif;">Pour le texte : </span></strong></u></p> <ul><li><span style="font-family:verdana, geneva, sans-serif;"><p></p> : pour contenir un paragraphe</span> </li><li><span style="font-family:verdana, geneva, sans-serif;"><b></b> : pour écrire en gras</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><u></u> : pour écrire souligner</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><i></i> : pour écrire en italique</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><a href="LIEN">TEXTE</href> : pour créer un lien cliquable (ex: <a href="<a href="http://melinyel.net" rel="external nofollow">http://melinyel.net">CLIQUE</a>ICI</href> </span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><blockquote></blockquote> : pour créer une citation</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><li></li> : élément d'une liste</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><ol></ol> : liste numérotée </span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><ul></ul> : liste à puce</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><center></center> : pour centrer du texte</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><font></font> : pour modifier les polices de caractères</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><strike></strike> : pour barrer du texte</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><applet></applet> : pour les applets java</span></li> </ul><p><u><strong><span style="font-family:verdana, geneva, sans-serif;">Pour des tableaux : </span></strong></u></p> <ul><li><span style="font-family:verdana, geneva, sans-serif;"><table></table> : pour créer un tableau</span> </li><li><span style="font-family:verdana, geneva, sans-serif;"><tr></tr> : pour créer une ligne</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><th></th> : cellule de légende de ligne ou de colonne</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><td></td> : pour créer une colonne</span></li> </ul><p><strong><u><span style="font-family:verdana, geneva, sans-serif;">Structure et habillage : </span></u></strong></p> <ul><li><span style="font-family:verdana, geneva, sans-serif;"><div></div> : définition de blocs, regroupement d'éléments</span> </li><li><span style="font-family:verdana, geneva, sans-serif;"><span></span> : habillage d'éléments de manière inline</span></li> </ul><p><u><span style="font-size:18px;"><span style="font-family:verdana, geneva, sans-serif;"><span style="color:#ff0000;"><strong>Nouveautés HTML 5 !</strong></span></span></span></u></p> <p> </p> <ul><li><span style="font-family:verdana, geneva, sans-serif;"><header></header> : en-tête</span> </li><li><span style="font-family:verdana, geneva, sans-serif;"><section></section> : section</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><article></article> : sous section pour un article</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><nav></nav> : bloc de navigation</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><aside></aside> : encart</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><figure></figure> : images et/ou vidéos</span></li> <li><span style="font-family:verdana, geneva, sans-serif;"><footer></footer> : pied de page</span></li> </ul><p></p><p>Pour toute aide poster votre question en réponse à la suite de ce topic, merci ! </p> <p> </p> <p style="text-align:right;">Baptiste.</p>
  • 0 0
    0 Topics
    0 Posts
    No new posts.
  • 0 0
    0 Topics
    0 Posts
    No new posts.
  • [Recherche] Site Mockup

    1
    0 Votes
    1 Posts
    2k Views
    F
    <p>Salut à tous,</p><p>Je suis actuellement à la recherche d'un site pour réaliser des maquettes simples et gratuitement.</p><p>Merci à vous,</p><p>FaKe77.</p>
  • HTML5 / CSS3 : Commencer dans la programmation

    Pinned
    5
    0 Votes
    5 Posts
    3k Views
    AzadA
    <p>Bonjour,</p> <p> </p> <p>Étant donné qu'une majorité de membres connaissent les bases de l'informatique et de la programmation, je m'adresse à l'autre partie de la communauté : ceux qui ne connaissent pas encore ce merveilleux monde de la programmation, mais qui cependant veulent commencer à s'y lancer.</p> <p> </p> <p>Alors, ce sujet sera très simple car il consistera en une première mission pour vous : <strong>Découvrir les bases</strong>.</p> <p>Pour cela, le plus simple reste inévitablement le Site du Zéro, avec le tutoriel en HTML5 & CSS3 que vous pouvez constater juste là :</p> <p> </p> <p><a data-ipb="nomediaparse" href="http://fr.openclassrooms.com/informatique/cours/apprenez-a-creer-votre-site-web-avec-html5-et-css3" rel="external nofollow">http://fr.openclassrooms.com/informatique/cours/apprenez-a-creer-votre-site-web-avec-html5-et-css3</a></p> <p> </p> <p>Ce tutoriel commence par vous apprendre <strong>les bases</strong>, il est fait pour des lecteurs n'ayant non seulement aucune base en programmation mais également de faibles bases en informatiques. Ainsi, tout le monde peut se lancer dans ce tutoriel et finir avec, je vous le garantis, un solide bagage en HTML / CSS (ce qui est déjà un début, ne sous-estimons pas un langage).</p> <p> </p> <p>A la fin de ce tutoriel, vous serez tous capable de créer un site simple (et vous pourrez l'héberger via Melinyel sans doute, par la suite), et de partager vos créations pour avoir des conseils, de l'aide, etc... </p> <p> </p> <p>Ceux qui ne connaissent pas la programmation, commencez par là, c'est un réel conseil.</p>
  • Liste des balises HTML5

    11
    0 Votes
    11 Posts
    4k Views
    I
    <p style="text-align:center;">Bonjour !</p> <p style="text-align:center;">Souvent, on code un site, et on se dit "mince, elle fait quoi dejà cette balise ? " ou "c'est quelle balise pour faire telle chose ?".</p> <p style="text-align:center;"> </p> <p style="text-align:center;">C'est pour cela que je vous propose un petit récapitulatif des balises utilisées en HTML5 ainsi que de leurs fontions.</p> <p style="text-align:center;">Un exemple concret est présent quand on clique sur les balises.</p> <p style="text-align:center;">( liste trouvée sur <a href="http://41mag.fr/liste-des-balises-html5" rel="external nofollow">http://41mag.fr/liste-des-balises-html5</a>)</p> <p style="text-align:center;"> </p> <p>  </p> <p style="text-align:center;"><a href="http://41mag.fr/liste-des-balises-html5/balise-html5-commentaire" rel="external nofollow"><!– … –></a><br/><br/> Définit un commentaire<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-doctype-html5" rel="external nofollow"><!DOCTYPE></a><br/><br/> Définit le type du document<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-a-html5-lien" rel="external nofollow"><a></a><br/><br/> Définit un lien<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-abbr-html5" rel="external nofollow"><abbr></a><br/><br/> Définit une abréviation<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-address-html5" rel="external nofollow"><address></a><br/><br/> Définit une adresse<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-area-html5" rel="external nofollow"><area></a><br/><br/> Définit une zone à l’intérieur d’une image<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-article-html5" rel="external nofollow"><article></a><br/><br/> Définit un article<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-aside-html5" rel="external nofollow"><aside></a><br/><br/> Définit une partie latérale au contenu<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-audio-html5" rel="external nofollow"><audio></a><br/><br/> Définit un fichier audio<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-b-html5" rel="external nofollow"><b></a><br/><br/> Texte en gras<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-base-html5" rel="external nofollow"><base></a><br/><br/> Définit une URL de base pour tous les liens de la page<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-do-html5" rel="external nofollow"><bdo></a><br/><br/> Définit la direction du texte<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-blockquote-html5" rel="external nofollow"><blockquote></a><br/><br/> Définit une longue citation<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-body-html5" rel="external nofollow"><body></a><br/><br/> Définit le corps de la page<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-br-html5" rel="external nofollow"><br></a><br/><br/> Saut de ligne<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-button-html5" rel="external nofollow"><button></a><br/><br/> Définit un bouton cliquable<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-canvas-html5" rel="external nofollow"><canvas></a><br/><br/> Définit un graphique<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-caption-html5" rel="external nofollow"><caption></a><br/><br/> Légende du tableau<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-cite-html5" rel="external nofollow"><cite></a><br/><br/> Définit une citation<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-code-html5" rel="external nofollow"><code></a><br/><br/> Mise en forme d’un texte en code informatique<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-col-html5" rel="external nofollow"><col></a><br/><br/> Définit une colonne d’un tableau<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-colgroup-html5" rel="external nofollow"><colgroup></a><br/><br/> Définit un groupe de colonne pour un tableau<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-command-html5" rel="external nofollow"><command></a><br/><br/> Définit un bouton de commande<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-datalist-html5" rel="external nofollow"><datalist</a><br/><br/> Définit une liste d’options<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-dd-html5" rel="external nofollow"><dd></a><br/><br/> Définition d’un terme<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-del-html5" rel="external nofollow"><del></a><br/><br/> Définit un texte supprimé<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-details-html5" rel="external nofollow"><details></a><br/><br/> Définit les détails d’un élément<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-dfn-html5" rel="external nofollow"><dfn></a><br/><br/> Définition<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-div-html5" rel="external nofollow"><div></a><br/><br/> Définit un calque ou une section<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-dl-html5" rel="external nofollow"><dl></a><br/><br/> Liste de définition<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-dt-html5" rel="external nofollow"><dt></a><br/><br/> Définition d’un terme<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-em-html5" rel="external nofollow"><em></a><br/><br/> Mise en exergue d’un texte – italique<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-embed-html5" rel="external nofollow"><embed></a><br/><br/> Définit un contenu extérieur (audio, vidéo …)<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-fieldset-html5" rel="external nofollow"><fieldset></a><br/><br/> Regroupe plusieurs éléments d’un formulaire<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-figcaption-html5" rel="external nofollow"><figcaption></a><br/><br/> Légende d’un groupe d’élément multimédia<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-figure-html5" rel="external nofollow"><figure></a><br/><br/> Définit un groupe d’élément multimédia<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-footer-html5" rel="external nofollow"><footer></a><br/><br/> Définit le bas d’un section ou d’une page<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-form-html5" rel="external nofollow"><form></a><br/><br/> Définit un formulaire<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-h1-a-h6-html5" rel="external nofollow"><h1> to <h6></a><br/><br/> Définit un titre par degré importance de 1 à 6<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-head-html5" rel="external nofollow"><head></a><br/><br/> Définit l’en-tête d’un document<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-header-html5" rel="external nofollow"><header></a><br/><br/> Définit le haut d’une section ou d’une page<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-hgroup-html5" rel="external nofollow"><hgroup></a><br/><br/> Regroupe les informations du haut d’une page ou section<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-hr-html5" rel="external nofollow"><hr></a><br/><br/> Barre horizontale<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-html-html5" rel="external nofollow"><html></a><br/><br/> Définit un document html<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-i-html5" rel="external nofollow"><i></a><br/><br/> Texte en italique<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-iframe-html5" rel="external nofollow"><iframe></a><br/><br/> Introduit un page html dans une frame<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-img-html5" rel="external nofollow"><img></a><br/><br/> Définit une image<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-input-html5" rel="external nofollow"><input></a><br/><br/> Définit un champ<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-ins-html5" rel="external nofollow"><ins></a><br/><br/> Définit un texte insérer<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-keygen-html5" rel="external nofollow"><keygen></a><br/><br/> Générateur de clé pour un formulaire<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-kbd-html5" rel="external nofollow"><kbd></a><br/><br/> Raccourcis ou touche du clavier<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-label-html5" rel="external nofollow"><label></a><br/><br/> Légende d’un groupe d’élément de formulaire<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-legend-html5" rel="external nofollow"><legend></a><br/><br/> Titre d’un groupe d’élément d’un formulaire<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-li-html5" rel="external nofollow"><li></a><br/><br/> Élément d’une liste<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-link-html5" rel="external nofollow"><link></a><br/><br/> Définit les relations entre les documents<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-map-html5" rel="external nofollow"><map></a><br/><br/> Définit une carte<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-mark-html5" rel="external nofollow"><mark></a><br/><br/> Mise en valeur d’un mot ou d’un texte – Texte marqué<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-math-html5" rel="external nofollow"><math></a><br/><br/> Définit une formule mathématique<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-menu-html5" rel="external nofollow"><menu></a><br/><br/> Définit un menu en liste<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-meta-html5" rel="external nofollow"><meta></a><br/><br/> Définit des informations relatives au document<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-meter-html5" rel="external nofollow"><meter></a><br/><br/> Définit une unité de mesure<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-nav-html5" rel="external nofollow"><nav></a><br/><br/> Définit un groupe de liens de navigation<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-noscript-html5" rel="external nofollow"><noscript></a><br/><br/> Définit une alternative au script non supporté<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-object-html5" rel="external nofollow"><object></a><br/><br/> Définit un objet du contenu extérieur multimédia<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-ol-html5" rel="external nofollow"><ol></a><br/><br/> Définit une liste ordonné<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-optgroup-html5" rel="external nofollow"><optgroup></a><br/><br/> Regroupe d’une liste d »option dans un formulaire<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-option-html5" rel="external nofollow"><option></a><br/><br/> Option d’une liste dans un formulaire<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-output-html5" rel="external nofollow"><output></a><br/><br/> Définit un type de sortie<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-p-html5-paragraph" rel="external nofollow"><p></a><br/><br/> Définit un paragraphe<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-param-html5" rel="external nofollow"><param></a><br/><br/> Définit les paramètres d’un objet<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-pre-html5" rel="external nofollow"><pre></a><br/><br/> Texte pré-formaté<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-progress-html5" rel="external nofollow"><progress></a><br/><br/> Définit une progression<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-q-html5" rel="external nofollow"><q></a><br/><br/> Définit une courte citation<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-rp-html5" rel="external nofollow"><rp></a><br/><br/> Annotation ruby si le script n’est pas supporté<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-rt-html5" rel="external nofollow"><rt></a><br/><br/> Annotation ruby d’explication<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-ruby-html5" rel="external nofollow"><ruby></a><br/><br/> Définit une annotation en ruby<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-samp-html5" rel="external nofollow"><samp></a><br/><br/> Définit un échantillon de code<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-script-html5" rel="external nofollow"><script></a><br/><br/> Définit un script<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-section-html5" rel="external nofollow"><section></a><br/><br/> Définit une section<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-select-html5" rel="external nofollow"><select></a><br/><br/> Définit une liste sélectionnable<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-small-html5" rel="external nofollow"><small></a><br/><br/> Minimise l’importance d’un texte<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-source-html5" rel="external nofollow"><source></a><br/><br/> Définit la source d’un contenu multimédia<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-span-html5" rel="external nofollow"><span></a><br/><br/> Définit une section de type inline<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-strong-html5" rel="external nofollow"><strong></a><br/><br/> Mise en exergue d’un texte – Texte en Gras<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-style-html5" rel="external nofollow"><style></a><br/><br/> Définit un style CSS<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-sub-html5" rel="external nofollow"><sub></a><br/><br/> Mise en indice d’un texte<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-summary-html5" rel="external nofollow"><summary></a><br/><br/> Définit l’en-tête des détails d’un document ou section<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-sup-html5" rel="external nofollow"><sup></a><br/><br/> Mise en exposant d’un texte<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-svg-html5" rel="external nofollow"><svg></a><br/><br/> Définit une image vectorielle<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-table-html5" rel="external nofollow"><table></a><br/><br/> Définit un tableau<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-tbody-html5" rel="external nofollow"><tbody></a><br/><br/> Définit le corps d’un tableau<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-td-html5" rel="external nofollow"><td></a><br/><br/> Définit une cellule d’un tableau<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-textarea-html5" rel="external nofollow"><textarea></a><br/><br/> Définit une zone de texte<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-tfoot-html5" rel="external nofollow"><tfoot></a><br/><br/> Définit le bas d’un tableau<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-th-html5" rel="external nofollow"><th></a><br/><br/> Définit une cellule d’en-tête d’un tableau<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-thead-html5" rel="external nofollow"><thead></a><br/><br/> Définit le haut d’un tableau<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-time-html5" rel="external nofollow"><time></a><br/><br/> Définit une unité de temps<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-title-html5" rel="external nofollow"><title></a><br/><br/> Définit le titre d’un document<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-tr-html5" rel="external nofollow"><tr></a><br/><br/> Définit une ligne de tableau<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-track-html5" rel="external nofollow"><track></a><br/><br/> Définit une unité de temps pour les éléments <audio> et <video>.<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-ul-html5" rel="external nofollow"><ul></a><br/><br/> Définit une liste non-ordonné<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-var-html5" rel="external nofollow"><var></a><br/><br/> Définit une variable<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-video-html5" rel="external nofollow"><video></a><br/><br/> Définit une vidéo<br/><br/><br/><br/><a href="http://41mag.fr/liste-des-balises-html5/balise-wbr-html5" rel="external nofollow"><wbr></a><br/><br/> Définit un possible retour à la ligne<br/><br/><br/>  </p>
  • [Bootstrap] SB Admin Template

    12
    0 Votes
    12 Posts
    5k Views
    IgniteI
    <p style="text-align:center;"><strong><span style="font-size:24px;"><span style="color:rgb(128,0,128);">BootStrap -SB Admin</span></span></strong></p> <p style="text-align:center;"> </p> <p>Bonjour à tous. Ce topic est pour ceux qui ne veulent pas passer leurs temps sur le css de leur site mais qui veulent quand même avoir un design pas trop repoussant.</p> <p></p><p><u><strong><span style="color:#0000ff;"><span style="font-size:18px;">Présentation :</span></span></strong></u></p> <p> </p> <p>Twitter Bootstrap est une collection d’outils utiles à la création de sites web et applications web. C’est un ensemble qui contient des codes HTML et CSS, des formulaires, boutons, outils de navigation et autre éléments interactifs, mais contient aussi des extensions JavaScript en option.</p> <p></p><p><u><span style="color:#ff0000;">Téléchargable sur le site officiel : </span></u></p> <p><a href="http://getbootstrap.com/" rel="external nofollow">Bootstrap</a></p> <p> </p> <p>Il présente plusieurs différents templates que vous pouvez visualiser ici  --> <strong><a href="http://startbootstrap.com/all-templates" rel="external nofollow">TEMPLATE</a></strong></p> <p> </p> <p>Je vous présente le Template<span style="color:#ff0000;"> SB Admin</span> car il est vraiment très utile pour la plupart des sites que vous concevez.</p> <p> </p> <p>exemple :</p> <p>Lien  vers le site: <a href="http://startbootstrap.com/sb-admin" rel="external nofollow">Start Bootstrap </a></p> <p>Lien vers l'exemple : <a href="http://startbootstrap.com/templates/sb-admin/" rel="external nofollow">SB Admin ci-dessous</a></p> <p> </p> <p style="text-align:center;"><img alt="sb-admin.jpg" src="http://startbootstrap.com/img/sb-admin.jpg"/></p> <p style="text-align:center;"> </p> <p style="text-align:center;"> </p> <p>Celui-ci est le SB Admin première version. Il existe la V2 qui inclue de nouvelles fonctionnalités.</p>
  • [Bootstrap] LayoutIt !

    1
    0 Votes
    1 Posts
    2k Views
    AzadA
    <p>Bonjour à tous, je vous présente un outil qui peut être très pratique si vous faites du web design : <a data-ipb="nomediaparse" href="http://www.layoutit.com/" rel="external nofollow"><strong>LayoutIt </strong></a>!<br/>  </p> <p> </p> <p><img alt="Sfhw5k7.png" src="https://i.imgur.com/Sfhw5k7.png"/></p> <p></p><p>Ce site est en quelque sorte un générateur de template, avec du drag & drop. Il utilise les atouts de bootstrap pour générer un parfait webdesign à télécharger (en HTML).<br/> L'interface de création ressemble à cela :</p> <p> </p> <p><img alt="QBpeLFT.png" src="https://i.imgur.com/QBpeLFT.png"/></p> <p style="text-align:center;"><br/><br/><br/><br/><br/> On y voit clairement l'interface pour déplacer ses modules, les supprimer, etc... Et en avoir une préview au final ! <br/> Voilà, si vous l'utilisez, postez vos screenshot du rendu final.<br/><br/><br/><span style="font-size:24px;"><strong><a data-ipb="nomediaparse" href="http://www.layoutit.com" rel="external nofollow">http://www.layoutit.com/</a></strong></span><br/><br/>  </p>
  • [Concours n°1 - Terminé] Programmation : Web !

    Locked
    6
    0 Votes
    6 Posts
    6k Views
    AzadA
    <p>Bonjour à tous.<br/>Aujourd'hui, je lance le premier <span style="color:#008000;"><strong>concours de programmation</strong></span>, donc pas nécessairement le plus dur.<br/><strong>C'est simple, celui-ci sera de coder un site web basique pour aider Akimace dans son projet !</strong></p><p>Toutes les informations sont ses besoins sont <a data-ipb="nomediaparse" href="<base_url>/index.php/topic/52-site-en-cours-de-r%C3%A9alisation/">ici</a>, mais je vais détailler.<br/><br/><strong>Langage de programmation du projet :</strong></p><ul><li><strong>Web </strong>:<br/>HTML / CSS (obligatoire).<br/>PHP, SQL, Javascript et autre (facultatif).<br/> </li></ul><p>Le but est de <strong>concevoir un site web</strong> de meilleur qualité que celui-ci : <a data-ipb="nomediaparse" href="http://club.quomodo.com/basketlesoler/le_club/contact.html" rel="external nofollow">Basket Club Solérien</a> (son club de basket).<br/><br/>La date limite est le <strong>31 Mars 2014, 23h59</strong>. </p><p> </p><p>Les participants devront préciser leurs noms, s'ils veulent s'y essayer, et ceux-ci seront inscrit ci-dessus.<br/>Les récompenses seront :</p><ul><li><span style="color:#008000;">20 points de réputation.</span><br/> </li></ul><p>Le code final sera exposé sur le GitHub de Melinyel, avec les crédits pour l'auteur.</p><p>J'espère que vous saurez monter vos capacités. </p>
  • [Show] Site HTML5/CSS3

    3
    0 Votes
    3 Posts
    2k Views
    K
    <p>Bonjour </p> <p> </p> <p>Un pote m'a demandé de lui faire un site web pour son groupe de musique rock/metal naissant, je suis partit sur l'idée d'un wordpress dernière gen avec un thème black etc... Puis finalement je n'ai pas trouvé mon bonheur et j'ai eu l'idée de créer moi même le site </p> <p> </p> <p>J'avais jamais fait de site web de 0 auparavant ceci est mon premier site web 100% moi, tout le code à été écrit à la main sur l'éditeur notepad++ par mes soins é_é</p> <p> </p> <p>Voila ce qu'il donne après environ 5h de travail :</p> <p><img alt="1395770083-screen1.png" src="<base_url>/applications/sslimageproxy/interface/image.php?url=http://image.noelshack.com/fichiers/2014/13/1395770083-screen1.png"/></p> <p>--</p> <p><img alt="1395770082-screen2.png" src="<base_url>/applications/sslimageproxy/interface/image.php?url=http://image.noelshack.com/fichiers/2014/13/1395770082-screen2.png"/></p> <p> </p> <p>Comme vous le voyez le travail effectué à été concentré sur la structure de la page et l'emplacement des fonctionnalités style menu, vidéobox et lecteur mp3 pour voir les derniers titres </p> <p> </p> <p>Le site n'est PAS une image les modules sont bien en place et fonctionnels, j'ai opté pour une dimension de 1360px de largeur, tout simplement car pour ce domaine de site un 1920+ n'aurait pas servit à grand chose, pour la hauteur aucune idée elle sera amenée à changer de tout de façon </p> <p> </p> <p>Il est structuré en 2 colonnes (Modules 300px largeur à gauche et le gros 750px central/gauche.</p> <p> </p> <p>Pour le design pour le moment seul le logo est définitif et c'est moi qui l'ai fait haha, les barres de menu, footer n'étant que pour la base, ah oui aussi le fond des modules et définitif, je rajouterais surement des petites images incrustées en transparence à l'intérieur histoire de donner du vivant.</p> <p> </p> <p>Voila si vous avez des critiques envoyez, oubliez pas c'est mon premier site Bonne soirée.</p> <p> </p> <p>Cordialement,</p> <p>Karles.</p>
  • Site en cours de réalisation

    37
    0 Votes
    37 Posts
    13k Views
    AkimaceA
    <p style="text-align:center;"><span style="color:#000000;"><span style="font-family:verdana, geneva, sans-serif;">Hey!</span></span></p> <p> </p> <p><span style="font-family:verdana, geneva, sans-serif;"><span style="color:#000000;">Dernièrement dans ma présentation je disais que j'étais entrain de faire un site, en faite on (ma classe) nous a demandé à chaque groupe d'en faire un pour une association. Mon groupe a choisis un club de basket et on doit apporter des améliorations à leur site, que voici : </span><a href="http://club.quomodo.com/basketlesoler/le_club/contact.html" rel="external nofollow"><span style="color:#000000;">http://club.quomodo.com/basketlesoler/le_club/contact.html</span></a></span></p> <p> </p> <p><span style="color:#000000;"><span style="font-family:verdana, geneva, sans-serif;">Comme je débute là dedans, j'ai pas trop trop avancé  :lol: </span></span></p> <p></p><blockquote class="ipsStyle_spoiler" data-ipsspoiler=""><img alt="1394397617-10006533-4019697026669-214188" src="<base_url>/applications/sslimageproxy/interface/image.php?url=http://image.noelshack.com/fichiers/2014/10/1394397617-10006533-4019697026669-2141887525-o.jpg"/></blockquote><p></p> <pre class="ipsCode prettyprint lang-html"> <!DOCTYPE html> <html> <head> <p><h2>Basket Club Solérien</h2> <p><img src="Mes documents/HTML/logo.gif" alt="Logo" /></p> &lt;h3&gt;C'est ici que seront présenté les actualités du &lt;mark&gt;Basket Club Solérien !&lt;mark/&gt;&lt;/h3&gt;&lt;/p&gt; &lt;meta charset="utf-8" /&gt; &lt;link rel="stylesheet" href="style.css" /&gt; <title> Basket Club Solérien </title> </head> <body><h4>On peut trouver sur notre site :</h4> <ul> <li><a href="http://www.siteduzero.com" title="Tout ce qui concerne les actualités du club.">Le Club</a></li> <li><a href="http://www.siteduzero.com" title="Les équipes classées par niveau du club.">Les équipes</a></li> <li><a href="http://www.siteduzero.com" title="Les plannings concernant les rencontres, tournois, matchs...">Les plannings</a></li> <li><balise><a href="http://www.siteduzero.com" title="Le programmes de l'année (actualisé toutes les semaines).">Les calendriers</a></balise> <p><a href="calendrier.zip">> Téléchargez le calendrier de la semaine ! <</a></p></li> <li><a href="http://www.siteduzero.com" title="Ici se trouve les documents d'inscriptions et quelques guides.">Les documents</a></li> <li><a href="http://www.siteduzero.com" title="Tout ce qui concerne le basket à l'école primaire.">Le basket à l'école</a></li> <li><a href="http://www.siteduzero.com" title="Les photos du club.">L'Album photos</a></li> <li><a href="http://www.siteduzero.com" title="Ici nous retrouverons tous les liens en relation avec le club.">Les liens</a></li> <body><h3> Contact :</h3> <p style="color: blue;">Voila notre page Facebook : <a href="https://www.facebook.com/pages/Basket-Club-Solérien-BCS/370393609765791" target="_blank">Facebook BCS</a><br /><br /></p> <p>Pour contacter le club : <a href="mailto:[email protected] ">Envoyez-moi un e-mail!</a></p> <p>La suite ici : <a href="TROLL/test2.html">CLIC ICI BATARD</p> </body> </html> </pre> <p><span style="color:#000000;"><span style="font-family:verdana, geneva, sans-serif;">Voilà où j'en suis pour le moment.</span></span></p> <p> </p> <p><span style="color:#000000;"><span style="font-family:verdana, geneva, sans-serif;">Si y en a qui peuvent donner un coup de main ça serait sympa  ^_^ </span></span></p> <p> </p> <p><span style="color:#000000;"><span style="font-family:verdana, geneva, sans-serif;">Merci d'avance,</span></span></p> <p><span style="color:#000000;"><span style="font-family:verdana, geneva, sans-serif;">Aki</span></span></p>