• 19 Mars 2024, 07:24:58


Auteur Sujet: [HTML 5 / CSS 3] Experience Template [Débutant]  (Lu 6204 fois)

0 Membres et 1 Invité sur ce sujet

Hors ligne Infu

  • *
  • Modo LS - Admin FnF
  • Messages: 3550
    • Voir le profil
[HTML 5 / CSS 3] Experience Template [Débutant]
« le: 05 Juin 2013, 18:20:08 »
Bonjour,

Depuis quelques temps je me mets à apprendre le HTML et le CSS. Grace aux connaissance que je bénéficie maintenant et de l'aide de maniac sur certain points... Je vous présente une template, simple mais suffisant pour quelqu'un qui souhaite juste faire apparaître trois ou quatre news. Tout est manuel (comme la majorité des templates), une news se fait dans le script.

Pour créer une news, il faut procéder comme ceci:

Code: (html5) [Sélectionner]
<section>
<div class="iconemessage"><div class="baralanoix"><p>
..Votre texte ici..
</p></div></div>
</section>

Explications...

Code: (html5) [Sélectionner]
<div class="iconemessage"> <!-- Permet d'afficher la flèche verte. (Que vous pouvez changer à partir du dossier d'images) -->
<div class="barrealanoix"> <!-- C'est la barre verticale blanche à côté de l'image. Elle se rétracte et s'allonge par rapport au nombre de lignes -->
<p></p> <!-- Permet de conserver la mise en page -->

L'ordre dans lequel j'ai disposé les balises est primordial, sinon tout sera au mauvais endroit.

Quelques screens...

Haut du site:

Bas du site:

Téléchargement...

SolidFiles - v1



Comme j'ai précisé dans l'archive, je vous demande de ne pas vous approprier ce fichier, ça ne vous coûte rien.


Adju ♥
(-_-)



Hors ligne rafffel

  • *
  • Bandit
  • Messages: 493
    • Voir le profil
Re : [HTML 5 / CSS 3] Experience Template [Débutant]
« Réponse #1 le: 05 Juin 2013, 19:15:06 »
Un peu light pour que ce soit un Template complet mais c'est déjà un bon début.
J'aime bien le fond .
Il te reste plus qu'à te mettre au php/mysql/javascript et tu auras la panoplie du parfait développeur web :p.

Hors ligne Infu

  • *
  • Modo LS - Admin FnF
  • Messages: 3550
    • Voir le profil
Re : [HTML 5 / CSS 3] Experience Template [Débutant]
« Réponse #2 le: 05 Juin 2013, 19:52:40 »
Merci Raffel. C'est vrai que c'est léger, mais disons que je me perfectionnerai ...
Pour le PHP toussa, Maniac m'a dit la même chose.


++  :smile:


Adju ♥
(-_-)



Hors ligne GtaManiac

  • Votre serviteur bien aimé
  • *
  • Redforce member
  • Messages: 8541
    • Voir le profil
    • GTAOnline.net
Re : [HTML 5 / CSS 3] Experience Template [Débutant]
« Réponse #3 le: 05 Juin 2013, 19:59:24 »
Ah ok je penser que tu voulais juste montrer un screen de ton blog :rolleyes:

Essaye de faire quelque chose d'un peu plus avancé et qui sort de l'ordinaire, moi j'ai juste fait en sorte que ton code soit pas crade en validant ça sur le W3C ^^

Sinon pour le JS c'est de moins en moins utiliser depuis HTML 5 et CSS3 avec toute les transitions et effet plus ou moins complexe qui sont possible maintenant, et puis un site sans JS c'est un gain de temps, réactivité et sécurité ^^
GTAOnline - TwitchFacebook - Twitter

"Le problème, c'est le choix" - Néo

Hors ligne rafffel

  • *
  • Bandit
  • Messages: 493
    • Voir le profil
Re : [HTML 5 / CSS 3] Experience Template [Débutant]
« Réponse #4 le: 05 Juin 2013, 20:07:40 »
Je suis d'accord sur le fait qu'il soit moins utiliser et encore que ça reste a voir avec les balises Canvas les  websocket (NodeJs) ,l'ajax(pour vérifier si un pseudo est déjà occuper par exemple) qui utilise le javascript.

Pour ce qui est des transition simple oui il est possible d'éviter le javascript mais l'apprendre ne sera pas un mal.
(surtout que pour connaitre la base de son utilisation on reste dans des choses simples).

Hors ligne Gzsume

  • *
  • Compétent dans l'inutile
  • Messages: 2236
    • Voir le profil
Re : [HTML 5 / CSS 3] Experience Template [Débutant]
« Réponse #5 le: 05 Juin 2013, 20:43:54 »
Évite d'utiliser un paragraphe pour la mise en page des marges, tous les navigateurs ne réagiront pas de la même manière et certains n'afficheront pas la même marge. À la place, tu peux utiliser le code CSS

Code: (css) [Sélectionner]
margin(-top, -bottom): 1337px;
Sur l'élément dont tu souhaites appliquer une marge. :wink:

Hors ligne GtaManiac

  • Votre serviteur bien aimé
  • *
  • Redforce member
  • Messages: 8541
    • Voir le profil
    • GTAOnline.net
Re : [HTML 5 / CSS 3] Experience Template [Débutant]
« Réponse #6 le: 05 Juin 2013, 21:28:37 »
Ouais c'est sur, ça reste largement utiliser mais de plus en plus de professionnel ou même des particuliers trouve des méthodes moins "lourdes" dans l'HTML5 et le CSS3 pour arriver à avoir la même chose, ce qui fait que c'est plus léger, plus rapide, moins chiant à mettre en place et t'es sur de pas te taper des injections :rolleyes:

Après certes, ça reste expérimental et il faut de la "mécanique" sous le capot ^^
GTAOnline - TwitchFacebook - Twitter

"Le problème, c'est le choix" - Néo

Hors ligne Rezen

  • Rezen le raisin !
  • *
  • Bandit
  • Gaming is fraternity™ - Since 2010
  • Messages: 395
    • Voir le profil
Re : [HTML 5 / CSS 3] Experience Template [Débutant]
« Réponse #7 le: 09 Juin 2013, 23:33:37 »
J'aime bien moi ! Courage mon p'tit Infu !  :kiss:
◄| GTAOnline.fr | GTACup.net | My Profil | FsK Site |►
Rezeи™ - Since 2002
"Ce qui rend le plus heureux, c'est la volonté de le devenir."

Hors ligne Infu

  • *
  • Modo LS - Admin FnF
  • Messages: 3550
    • Voir le profil
Re : [HTML 5 / CSS 3] Experience Template [Débutant]
« Réponse #8 le: 10 Juin 2013, 15:44:37 »
Merci rezen :)

[spoiler]Tiens voilà tes 10€  :closedeyes:

[/spoiler]


Adju ♥
(-_-)