Changement du format dans Balise <H2>

Fermé

mhd91800 Messages postés 498 Date d'inscription lundi 19 décembre 2011 Statut Membre Dernière intervention 15 juin 2016 - 10 oct. 2014 à 14:23
mhd91800 Messages postés 498 Date d'inscription lundi 19 décembre 2011 Statut Membre Dernière intervention 15 juin 2016 - 11 oct. 2014 à 17:57

Bonjour,

Voilà j'ai commencer le Html y'a 2 semaines et la je me suis mit au défit de faire un petit site vitrine, cependant je pêche sur comment faire pour changer de police juste 2 mots je vous met la commande pour plus de compréhension

<H2> Univers PC, Ici nous allons aborder toutes les nouveautés sur nos chères PC.<H2>

Mon but c'est changer la police et la taille juste sur Univers PC et le mettre en gras et à partir de la virgule je voudrais tout mettre en italique et mettre une taille en dessous de celle d'Univers PC.

Comment faire svp ?

à savoir que je code mon CSS directement dans un fichier CSS et non pas dans ma page html..

j'ai essayer avec <H2 class="Univers PC"> ........... dans mon CSS il me change tout le titre à cause de la balise H2.

J'ai aussi essayer un truc du genre : <H2><div> Univers PC</div> la ça marche mais le reste après le div reste en format de base de la balise <H2>...

dans mon CSS j'ai fait

H2 div{
font-weight: normal;
font-size: 0.9em;
font-style: oblique;}

A voir également:

Changement du format dans Balise <H2>
Format epub - Guide
Telecharger format factory - Télécharger - Conversion & Codecs
Format apfs - Guide
Changement dns - Guide
Changement d'écriture - Guide

3 réponses

Réponse 1 / 3

Benoit A. Messages postés 454 Date d'inscription mercredi 8 février 2012 Statut Membre Dernière intervention 13 août 2015 515
10 oct. 2014 à 14:33

Dans ton fichier CSS tu dois appeler autrement ta fonction h2 :
si tu veux cibler tous les h2 tu écris simplement

h2 
{ 
font-weight: normal; 
font-size: 0.9em; 
font-style: oblique;
}

Si ton h2 est dans une div alors il faut appeler la div puis la h2

#nomdetadiv h2
{
font-weight: normal; 
font-size: 0.9em; 
font-style: oblique;
}

Mais d'après ce que je vois tu as mis une class à ton h2 donc pour seulement modifier tous les h2 qui comporte le même attribut "Univers_PC" il faut :

#nomdetadiv .Univers_PC
{
font-weight: normal; 
font-size: 0.9em; 
font-style: oblique;
}

ATTENTION LORSQUE TU CODES IL EST RECOMMANDE DE NE PAS METTRE D'ESPACE DANS LES ATTRIBUTS. CELA PEUT POSER DES PROBLÈMES. UTILISES PLUS _ POUR SÉPARER TES TEXTES SI C'EST VRAIMENT INDISPENSABLE.

mhd91800 Messages postés 498 Date d'inscription lundi 19 décembre 2011 Statut Membre Dernière intervention 15 juin 2016 6
10 oct. 2014 à 14:39

est ce qu'il y'a un moyen de le faire sans la div ? car à la base j'était partit pour le faire sans car je suis pas trop à l'aise avec la div et la span j'ai un peu de mal à les manier....

tu à dis si mon H2 et dans ma div ?? ça voudrais dire qu'il faut que je fasse <div><H2> et non pas <H2><div> ?

Benoit A. Messages postés 454 Date d'inscription mercredi 8 février 2012 Statut Membre Dernière intervention 13 août 2015 515
10 oct. 2014 à 14:44

Non non. Ta page doit être constituer de plusieurs parties qu'on appelle <div> : <head><body><corps><footer> etc.

Ton code à proprement parler pour le contenu de ton site doit se trouver dans la balise <body></body> dans cette div tu peux en rajouter par exemple tu peux diviser ça en plusieurs parties.
<div id="menu"><div id="navigation"> <div id="contenu> ...

Prenons le cas où mon h2 se trouve dans la div navigation le code css serait le suivant :

#navigation h2
{
font-weight: normal; 
font-size: 0.9em; 
font-style: oblique;
}

OU vu que tu as mis l'attribut "class" à ton h2

#navigation .Univers_PC
{
font-weight: normal; 
font-size: 0.9em; 
font-style: oblique;
}

Tu dois répéter ce schéma pour toute ta mise en forme.

mhd91800 Messages postés 498 Date d'inscription lundi 19 décembre 2011 Statut Membre Dernière intervention 15 juin 2016 6
10 oct. 2014 à 14:50

j'en suis pas encore la et j'ai pas autant de div lol :p

j'en suis la pour le moment :p

<!DOCTYPE html>

<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="Mon Site.css" />
<p><title> My Geek - Site communautaire pour les GEEKS </title></p>
</head>

<body>
<p> Bonjour à tous et bienvenue sur mon site, j'espére que vous y trouverez votre bonheur. <br />
Vous vous demandez peut être de quoi il en retourne ici ? de quoi allons nous discuter ? etc etc, la réponse tout de suite. </p>
<p> En cas de besoin vous pouvez me contacter <a href="mailt:mhd.brunel@gmail.com" id="ici"> ici </a></p>
<p> Aller c'est partie un bref apperçu de ce que vous allez pouvoir trouver sur ce site histoire de vous faire une idée : </p>
<ol>
<li> PC <ul>
<li> Hardware </li>
<li> Jeux Video </li></ul></li>
<li> Console <ul>
<li> Xbox One </li>
<li> Ps4 </li></ul></li>
</ol>
<p> Je vais commencer par la section PC pourquoi ? Avant tout c'est celle que je préfère cette univers est juste fascinant entre la partie <strong> HARDWARE </strong> et <strong> JEUX </strong> il y'a de quoi faire. <br />
Mais pas d'inquiétude pour les <strong> GAMERS </strong> consoles, vous aussi vous aurez de quoi faire en allant dans votre section. Commençons : </p>
<H2> Univers PC, ici nous allons blblabla </H2>

j'ai juste mit une div dans mon H2 pour tester ensuite en CSS si ça aller marcher mais le problème c'est quand je veux modifier juste Univers PC... ça me change tout mon H2

Benoit A. Messages postés 454 Date d'inscription mercredi 8 février 2012 Statut Membre Dernière intervention 13 août 2015 515
10 oct. 2014 à 14:56

Euhh si tu codes tout ton site comme ça ça va être très compliqué !!!

Regarde ça :

CODE HTML :

<body> 

<div id="intro">

<p> Bonjour à tous et bienvenue sur mon site, j'espére que vous y trouverez votre bonheur. <br /> 
Vous vous demandez peut être de quoi il en retourne ici ? de quoi allons nous discuter ? etc etc, la réponse tout de suite. </p> 
<p> En cas de besoin vous pouvez me contacter <a href="mailt:mhd.brunel@gmail.com" id="ici"> ici </a></p> 
<p> Aller c'est partie un bref apperçu de ce que vous allez pouvoir trouver sur ce site histoire de vous faire une idée : </p> 

</div>

<div id="menu">

<ol> 
<li> PC <ul> 
<li> Hardware </li> 
<li> Jeux Video </li></ul></li> 
<li> Console <ul> 
<li> Xbox One </li> 
<li> Ps4 </li></ul></li> 
</ol> 

</div>

<div id="corps">

<p> Je vais commencer par la section PC pourquoi ? Avant tout c'est celle que je préfère cette univers est juste fascinant entre la partie <strong> HARDWARE </strong> et <strong> JEUX </strong> il y'a de quoi faire. <br /> 
Mais pas d'inquiétude pour les <strong> GAMERS </strong> consoles, vous aussi vous aurez de quoi faire en allant dans votre section. Commençons : </p> 

<H2> <p class="mots_cles"> Univers PC</p>, ici nous allons blblabla </H2> 

</div>
...

CODE CSS :

#corps .mots_cles
{
color:purple;
font-weight:bold;
font-style:italic;
}

Benoit A. Messages postés 454 Date d'inscription mercredi 8 février 2012 Statut Membre Dernière intervention 13 août 2015 515
10 oct. 2014 à 14:57

Bon après le nom des éléments je l'ai fais comme ça à la volée. Il faut bien sûr le travailler davantage.

Réponse 2 / 3

jambondardennes Messages postés 481 Date d'inscription jeudi 12 juin 2008 Statut Membre Dernière intervention 6 septembre 2017 39
10 oct. 2014 à 14:29

bonjour,

pour mettre en italique il faut ajouter ceci dans le css au niveau de la balise h2 :
-

font-style: italic;

pour mettre en gras il suffit d'entourer les mots concernés par la balise strong comme ceci pour vous :
-

<strong>Univers PC</strong>

Cordialement,

Réponse 3 / 3

mhd91800 Messages postés 498 Date d'inscription lundi 19 décembre 2011 Statut Membre Dernière intervention 15 juin 2016 6
10 oct. 2014 à 14:35

<strong> n'est pas une mise en gras à proprement parler meme si le texte se met en gras c'est juste un pointage sur un mot important et j'ai pas trop envie de le laisser comme ça sinon j'aurai put tout aussi bien faire :

Page html : <H2> Univers PC, <em>ici nous allons blblabla </em> </H2>

ensuite dans le CSS : H2 em{ font-style: oblique; font-size: 0.9em;}

ça aurai mit en italique ou oblique juste ce qu'il y'a après la virgule mais c'est pas ce que je recherche même si le résultat est le même mais je préfère avoir recourt à de bonne methode avec font-weight et font-style et surtout ça me permettra de bien gérer les éventuel changements avec les doubles balises pour avoir un style différent bien précis

Discussions similaires

la balise <br> ou <br />

Balise </br>

Menace et chantage sexué