IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

css @font-face { nouvelle police


Sujet :

CSS

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé
    Profil pro
    Inscrit en
    Février 2007
    Messages
    356
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Février 2007
    Messages : 356
    Par défaut css @font-face { nouvelle police
    bonjour,

    j'ai une nouvelle police, qui, pour etre visible doit etre transformée dans le site FONT SQUIRREL que certains connaissent.

    Le problème c'est que j'ai rédigé mon code, que la police fonctionne lorsque je lis l'index.html dans mon dossier (surement car la police est installée sur mon ordi) , mais qu'elle n'est pas visible sur l'index.html dans dreamweaver (qui lui me donne le réel apercu des autres utilisateurs).

    Donc mon code doit etre faux.

    Est ce que quelqu'un ce qui ne va pas dans mon code svp ?

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    @font-face {
        font-family: 'BirdcherryRegular';
        src: url('birdcherry-webfont.eot');
        src: url('birdcherry-webfont.eot?#iefix') format('embedded-opentype'),
             url('birdcherry-webfont.woff') format('woff'),
             url('birdcherry-webfont.ttf') format('truetype'),
             url('birdcherry-webfont.svg#BirdcherryRegular') format('svg');
        font-weight: normal;
        font-style: normal;
    }
     
    @charset "UTF-8";
    body {
    	margin: auto;
    	padding: 0;
    	color: #000;
    	height: 1421px;
    	width: 1674px;
    	background-image: url(images/fond.png);
    	background-repeat: no-repeat;
    	font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
     
    }
     
    /* ~~ Sélecteurs d'éléments/balises ~~ */
    ul, ol, dl { /* En raison des variations entre les navigateurs, il est conseillé d'attribuer une valeur de zéro aux marges intérieures et aux marges des listes. A des fins de cohérence, vous pouvez définir les valeurs désirées dans cette zone ou dans les éléments de liste (LI, DT, DD) qu'elle contient. N'oubliez pas que les paramètres que vous définissez ici se répercuteront sur la liste .nav, sauf si vous rédigez un sélecteur plus spécifique. */
    	padding: 0;
    	margin: 0;
    }
    h1, h2, h3, h4, h5, h6, p {
    	margin-top: 0;	 /* la suppression de la marge supérieure résout un problème où les marges sortent de leur div conteneur. La marge inférieure restante l'éloignera de tout élément qui suit. */
    	padding-right: 15px;
    	padding-left: 15px; /* l'ajout de la marge intérieure aux côtés des éléments à l'intérieur des divs, et non aux divs proprement dit, évite le recours à des calculs de modèle de boîte. Une autre méthode consiste à employer une div imbriquée avec marge intérieure latérale. */
    }
    a img { /* ce sélecteur élimine la bordure bleue par défaut affichée dans certains navigateurs autour d'une image lorsque celle-ci est entourée d'un lien. */
    	border: none;
    }
    /* ~~ La définition du style des liens de votre site doit respecter cet ordre, y compris le groupe de sélecteurs qui créent l'effet de survol. ~~ */
    a:link {
    	color: #42413C;
    	text-decoration: underline; /* à moins que vous ne définissiez un style particulièrement exclusif pour vos liens, mieux vaut prévoir un soulignement, qui garantit une identification visuelle rapide. */
    }
    a:visited {
    	color: #6E6C64;
    	text-decoration: underline;
    }
    a:hover, a:active, a:focus { /* ce groupe de sélecteurs offrira à un navigateur au clavier la même expérience de survol que celle d'une personne employant la souris. */
    	text-decoration: none;
    }
     
    /* ~~ ce conteneur à largeur fixe entoure les autres divs ~~ */
    .container {
    	width: 860px;
    	background-color: #FFF;
    	margin: auto;
    }
     
    /* ~~ aucune largeur n'est attribuée à l'en-tête. Il occupera toute la largeur de votre mise en page. Il contient un espace réservé pour une image, qui doit être remplacé par votre logo lié. ~~ */
    .header {
    	background-color: #FFFFFF;
    	width: 860px;
    	height: 260px;
    	background-image: url(images/fond_header.png);
    	background-repeat: no-repeat;
    }
     
    /* ~~ Informations de mise en page. ~~ 
     
    1) La marge intérieure n'est placée qu'en haut et/ou en bas de la div. Les éléments à l'intérieur de cette div posséderont une marge intérieure sur les côtés. Vous évitez ainsi de devoir recourir à des «*calculs de modèle de boîte*». N'oubliez pas que si vous ajoutez une marge intérieure latérale ou une bordure à la div proprement dite, elle sera ajoutée à la largeur que vous définissez pour créer la largeur totale. Vous pouvez également supprimer la marge intérieure de l'élément dans la div et placer une seconde div à l'intérieur, sans largeur et possédant une marge intérieure appropriée pour votre concept.
     
    */
     
    .content {
    	padding: 10px 0;
    	width: 860px;
    	height: 885px;
    }
     
    /* ~~ Pied de page ~~ */
    .footer {
    	padding: 10px 0;
    	background-color: #FFFFFF;
    	width: 860px;
    	height: 45px;
    }
     
    /* ~~ classes flottant/effacement diverses ~~ */
    .fltrt {  /* cette classe peut servir à faire flotter un élément depuis la droite sur votre page. L'élément flottant doit précéder l'élément à côté duquel il doit apparaître sur la page. */
    	float: right;
    	margin-left: 8px;
    }
    .fltlft { /* cette classe peut servir à faire flotter un élément depuis la gauche sur votre page. L'élément flottant doit précéder l'élément à côté duquel il doit apparaître sur la page. */
    	float: left;
    	margin-right: 8px;
    }
    .clearfloat { /* cette classe peut être placée sur une div <br /> ou vide, en tant qu'élément final suivant la dernière div flottante (dans le #container) si le paramètre #footer est supprimé ou retiré du #container */
    	clear:both;
    	height:0;
    	font-size: 1px;
    	line-height: 0px;
    }

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    <!doctype html>
    <html>
    <head>
    <meta charset="UTF-8">
     
    <title>Plénitude Beauté 06 Cannes - Soins esthétiques à domicile</title>
    <meta name = "description" content = " sur Cannes et environs. Massages, épilations, soins visage, maquillage et manucure-pédicure."/>
    <meta name="Identifier-URL" content ="www.plenitude-beaute06.com"/>
    <meta name="keyboards" content ="massage, massages, masseuse épilation, soin visage, maquillage, maquilleuse, manucure, pédicure, à domicile, cannes, antibes, la bocca, 06, 83, alpes maritimes, var "/>
     
    <link href="style.css" rel="stylesheet" type="text/css">
     
     
    <style type="text/css">
     
     body {
        font-family: BelleroseLight;
     src: url('http://plenitude-beaute06.com/font/bellerose-webfont.eot');
        src: url('http://plenitude-beaute06.com/font/bellerose-webfont.eot?#iefix') format('embedded-opentype'),
             url('http://plenitude-beaute06.com/font/bellerose-webfont.woff') format('woff'),
             url('http://plenitude-beaute06.com/font/bellerose-webfont.ttf') format('truetype'),
             url('http://plenitude-beaute06.com/font/bellerose-webfont.svg#BelleroseLight') format('svg');
        font-weight: normal;
        font-style: normal;
     
        background-color: transparent 
    }
     
      </style>
     
     
    </head>
     
    <body>
     
    <div class="container">
      <div class="header"><!-- end .header --></div>
      <div class="content">
        <h1>Instructions</h1>
        <p>Notez que le code CSS </a>.</p>
        <h2>Mise en page</h2>
        <p>Comme il s'agit d'une mise en page à une colonne, le .content n'est pas flottant. </p>
        <h3>Remplacement du logo</h3>
        <p>Dans la zone .header, un espace réservé pour image a été utilisé à l'endroit où vous souhaiterez probablement placer un logo. Il est conseillé de supprimer l'espace réservé et de le remplacer par votre logo lié. </p>
        <p> Notez que si vous utilisez l'inspecteur  </p>
        <p>Pour supprimer les styles intégrés</p>
        <!-- end .content --></div>
      <div class="footer">
        <p>Pied de page</p>
        <!-- end .footer --></div>
      <!-- end .container --></div>
    </body>
    </html>
    je vous remercie

  2. #2
    Membre expérimenté Avatar de MaitreKaio
    Profil pro
    Freelance Java / Web / Mobile
    Inscrit en
    Juin 2007
    Messages
    140
    Détails du profil
    Informations personnelles :
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Freelance Java / Web / Mobile
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Juin 2007
    Messages : 140
    Par défaut
    Tu veux dire que si tu ouvres ton fichier index.html dans la navigateur, ça marche mais pas si tu l'ouvres avec Dreamweaver ?
    En tous cas quand je regarde ton code, je vois que tu déclares la police, mais je ne vois pas où tu l'utilises dans tes styles... Tu as:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    body {     font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif; }
    Alors que je m'attendrais à:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    body {     font: 100%/1.4 'BirdcherryRegular', Verdana, Arial, Helvetica, sans-serif; }

  3. #3
    Rédacteur

    Avatar de Torgar
    Homme Profil pro
    Développeur Web
    Inscrit en
    Août 2007
    Messages
    2 334
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 39
    Localisation : France, Hérault (Languedoc Roussillon)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Août 2007
    Messages : 2 334
    Par défaut
    Pour compléter la réponse de MaitreKaio.

    Pour définir une police, c'est comme dans ton fichier css, c'est avec @font-face.

    Et puis attention aux chemins de tes fichiers, tu avais oublié le dossier "/bellerose/".

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    <style type="text/css">
    @font-face {
        font-family: 'BelleroseLight';
            src: url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.eot');
            src: url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.eot?#iefix') format('embedded-opentype'),
            url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.woff') format('woff'),
            url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.ttf') format('truetype');
            url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.svg#BelleroseLight') format('svg');
        font-weight: normal;
        font-style: normal;
     
     
        background-color: transparent
    }
     
    body {
        font-family: Bellerose;
    }
    </style>
    Maintenant tu peux choisir entre Bellerose et BirdcherryRegular, si les deux polices sont bien dans leur dossier respectif. Et tu n'est pas obligé d'utiliser les chemins absolu.


    PS: les quotes sont optionnelles puisqu'il ne s'agit pas d'un nom composé ('Bellerose Light' par exemple).
    Je ne suis pas schizophrène, nous sommes unanime !!!

    ► Pensez à la balise code et au CODE HTML GENERE !!!!
    ► Au si c'est le cas et au à ceux qui vous ont aidé.
    Vous souhaitez participer aux rubriques CSS et (X)HTML ? Contactez-nous !

    Créer des colonnes de même hauteur en CSS
    Glossaire CSS
    Les bordures en CSS3
    Les transitions en CSS3

  4. #4
    Membre éclairé
    Profil pro
    Inscrit en
    Février 2007
    Messages
    356
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Février 2007
    Messages : 356
    Par défaut
    merci beaucoup pour votre aide, ca m'a déjà éclairci sur pas mal de choses.
    En effet j'ai confondu 2 police, la bellerose et la birdcherry.
    En réalité je n'avais besoin que de la bellerose.

    Mais du coup j'ai remodifié le bro code, mais j'ai toujours un problème qui m'empeche de voir la police dans DW , mais qui fonctionne dans l'index.html du dossier.

    Si vous aviez encore une petite idée s'il vous plait, ca serait super!


    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    <!doctype html>
    <html>
    <head>
    <meta charset="UTF-8">
     
    <title>Plénitude Beauté 06 Cannes - Soins esthétiques à domicile</title>
    <meta name = "description" content = " sur Cannes et environs. Massages, épilations, soins visage, maquillage et manucure-pédicure."/>
    <meta name="Identifier-URL" content ="www.plenitude-beaute06.com"/>
    <meta name="keyboards" content ="massage, massages, masseuse épilation, soin visage, maquillage, maquilleuse, manucure, pédicure, à domicile, cannes, antibes, la bocca, 06, 83, alpes maritimes, var "/>
     
    <link href="style.css" rel="stylesheet" type="text/css">
     
     
    <style type="text/css">
    @font-face {
        font-family: 'BelleroseLight';
            src: url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.eot');
            src: url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.eot?#iefix') format('embedded-opentype'),
            url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.woff') format('woff'),
            url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.ttf') format('truetype');
            url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.svg#BelleroseLight') format('svg');
        font-weight: normal;
        font-style: normal;
     
     
        background-color: transparent
    }
     
    body {
        font-family: BelleroseLight;
    }
    <!--
    body { }
    #accueil { position:absolute; top:170px; left:405px; width:860px; height:30px; z-index:1;}
    </style>
     
     
     
     
    </head>
     
    <body>
     
    <div class="container">
      <div class="header">
     
      <div id="accueil" style= border: 0px ;">
      <center><a href="http://plenitude-beaute06.com" style="color:#000000;text-decoration:none;font-size:25px;">ACCUEIL</a>
      &nbsp;
        <a href="http://plenitude-beaute06.com" style="color:#000000;text-decoration:none;font-size:25px;">BLOG</a>
      &nbsp;
       <a href="http://plenitude-beaute06.com/contact" style="color:#000000;text-decoration:none;font-size:25px;">CONTACT</a>
       &nbsp;
       <a href="http://plenitude-beaute06.com/parrainage" style="color:#000000;text-decoration:none;font-size:25px;">PARRAINAGE</a>
       &nbsp;
        <a href="http://plenitude-beaute06.com/produit" style="color:#000000;text-decoration:none;font-size:25px;">PRODUITS</a>
        &nbsp;&nbsp;
        <a href="http://plenitude-beaute06.com/partenaires" style="color:#000000;text-decoration:none;font-size:25px;">PARTENAIRES</a>
     
     
     
      </center>
      </div>
     
      <!-- end .header --></div>
      <div class="content">
        <h1>Instructions</h1>
        <p>Notez que le code CSS de ces mises en forme contient une grande quantité de commentaires. Si vous travaillez principalement en mode Création, jetez un coup d'œil au code afin d'obtenir des conseils sur l'utilisation du code CSS pour les mises en forme fixes. Vous pouvez supprimer ces commentaires avant de lancer votre site. Pour en savoir plus sur les techniques utilisées dans ces mises en forme CSS, consultez l'article suivant sur le centre pour développeurs Adobe : <a href="http://www.adobe.com/go/adc_css_layouts">http://www.adobe.com/go/adc_css_layouts</a>.</p>
        <h2>Mise en pag05Comme il s'agit d'une mise en page à une colonne, le .content n'est pas flottant. </h2>
        <h3>Remplacement du logo</h3>
        <p>Dans la zone .header, un espace réservé pour image a été utilisé à l'endroit où vous souhaiterez probablement placer un logo. Il est conseillé de supprimer l'espace réservé et de le remplacer par votre logo lié. </p>
        <p> Notez que si vous utilisez l'inspecteur Propriétés pour accéder à l'image de votre logo à l'aide de la zone SRC (au lieu de supprimer l'espace réservé puis de le remplacer), vous devez veiller à supprimer les propriétés intégrées d'arrière-plan et d'affichage. Ces styles intégrés servent uniquement à permettre l'affichage de l'espace réservé du logo dans des navigateurs à des fins de démonstration. </p>
        <p>Pour supprimer les styles intégrés, assurez-vous que le panneau Styles CSS est bien en mode Actuel. Sélectionnez l'image puis, dans le volet Propriétés du panneau Styles CSS, cliquez à l'aide du bouton droit puis supprimez les propriétés d'affichage et d'arrière-plan. Bien entendu, vous pouvez toujours accéder directement au code et y supprimer les styles intégrés depuis l'image ou l'espace réservé.</p>
        <!-- end .content --></div>
      <div class="footer">
        <p>Pied de page</p>
        <!-- end .footer --></div>
      <!-- end .container --></div>
    </body>
    </html>


    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    @font-face {
    font-family: 'BelleroseLight';
            src: url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.eot');
            src: url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.eot?#iefix') format('embedded-opentype'),
            url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.woff') format('woff'),
            url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.ttf') format('truetype');
            url('http://plenitude-beaute06.com/font/bellerose/bellerose-webfont.svg#BelleroseLight') format('svg');
        font-weight: normal;
        font-style: normal;
    }
     
     
    @charset "UTF-8";
    body {
    	margin: auto;
    	padding: 0;
    	color: #000;
    	height: 1421px;
    	width: 1674px;
    	background-image: url(images/fond.png);
    	background-repeat: no-repeat;
    	font: 100%/1.4 'BelleroseLight', Verdana, Arial, Helvetica, sans-serif;
     
    }
     
    /* ~~ Sélecteurs d'éléments/balises ~~ */
    ul, ol, dl { /* En raison des variations entre les navigateurs, il est conseillé d'attribuer une valeur de zéro aux marges intérieures et aux marges des listes. A des fins de cohérence, vous pouvez définir les valeurs désirées dans cette zone ou dans les éléments de liste (LI, DT, DD) qu'elle contient. N'oubliez pas que les paramètres que vous définissez ici se répercuteront sur la liste .nav, sauf si vous rédigez un sélecteur plus spécifique. */
    	padding: 0;
    	margin: 0;
    }
    h1, h2, h3, h4, h5, h6, p {
    	margin-top: 0;	 /* la suppression de la marge supérieure résout un problème où les marges sortent de leur div conteneur. La marge inférieure restante l'éloignera de tout élément qui suit. */
    	padding-right: 15px;
    	padding-left: 15px; /* l'ajout de la marge intérieure aux côtés des éléments à l'intérieur des divs, et non aux divs proprement dit, évite le recours à des calculs de modèle de boîte. Une autre méthode consiste à employer une div imbriquée avec marge intérieure latérale. */
    }
    a img { /* ce sélecteur élimine la bordure bleue par défaut affichée dans certains navigateurs autour d'une image lorsque celle-ci est entourée d'un lien. */
    	border: none;
    }
    /* ~~ La définition du style des liens de votre site doit respecter cet ordre, y compris le groupe de sélecteurs qui créent l'effet de survol. ~~ */
    a:link {
    	color: #42413C;
    	text-decoration: underline; /* à moins que vous ne définissiez un style particulièrement exclusif pour vos liens, mieux vaut prévoir un soulignement, qui garantit une identification visuelle rapide. */
    }
    a:visited {
    	color: #6E6C64;
    	text-decoration: underline;
    }
    a:hover, a:active, a:focus { /* ce groupe de sélecteurs offrira à un navigateur au clavier la même expérience de survol que celle d'une personne employant la souris. */
    	text-decoration: none;
    }
     
    /* ~~ ce conteneur à largeur fixe entoure les autres divs ~~ */
    .container {
    	width: 860px;
    	background-color: #FFF;
    	margin: auto;
    }
     
    /* ~~ aucune largeur n'est attribuée à l'en-tête. Il occupera toute la largeur de votre mise en page. Il contient un espace réservé pour une image, qui doit être remplacé par votre logo lié. ~~ */
    .header {
    	background-color: #FFFFFF;
    	width: 860px;
    	height: 260px;
    	background-image: url(images/fond_header.png);
    	background-repeat: no-repeat;
    }
     
    /* ~~ Informations de mise en page. ~~ 
     
    1) La marge intérieure n'est placée qu'en haut et/ou en bas de la div. Les éléments à l'intérieur de cette div posséderont une marge intérieure sur les côtés. Vous évitez ainsi de devoir recourir à des «*calculs de modèle de boîte*». N'oubliez pas que si vous ajoutez une marge intérieure latérale ou une bordure à la div proprement dite, elle sera ajoutée à la largeur que vous définissez pour créer la largeur totale. Vous pouvez également supprimer la marge intérieure de l'élément dans la div et placer une seconde div à l'intérieur, sans largeur et possédant une marge intérieure appropriée pour votre concept.
     
    */
     
    .content {
    	padding: 10px 0;
    	width: 860px;
    	height: 885px;
    }
     
    /* ~~ Pied de page ~~ */
    .footer {
    	padding: 10px 0;
    	background-color: #FFFFFF;
    	width: 860px;
    	height: 45px;
    }
     
    /* ~~ classes flottant/effacement diverses ~~ */
    .fltrt {  /* cette classe peut servir à faire flotter un élément depuis la droite sur votre page. L'élément flottant doit précéder l'élément à côté duquel il doit apparaître sur la page. */
    	float: right;
    	margin-left: 8px;
    }
    .fltlft { /* cette classe peut servir à faire flotter un élément depuis la gauche sur votre page. L'élément flottant doit précéder l'élément à côté duquel il doit apparaître sur la page. */
    	float: left;
    	margin-right: 8px;
    }
    .clearfloat { /* cette classe peut être placée sur une div <br /> ou vide, en tant qu'élément final suivant la dernière div flottante (dans le #container) si le paramètre #footer est supprimé ou retiré du #container */
    	clear:both;
    	height:0;
    	font-size: 1px;
    	line-height: 0px;
    }

  5. #5
    Rédacteur

    Avatar de Torgar
    Homme Profil pro
    Développeur Web
    Inscrit en
    Août 2007
    Messages
    2 334
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 39
    Localisation : France, Hérault (Languedoc Roussillon)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Août 2007
    Messages : 2 334
    Par défaut
    Un seul font-face est à définir, pas besoin d'en mettre dans le style.css et dans le fichier html.

    Après pour DW c'est peut-être une option de l'EDI de ne pas afficher les polices perso. A voir dans les paramètres. Ne l'ayant jamais utilisé...
    Je ne suis pas schizophrène, nous sommes unanime !!!

    ► Pensez à la balise code et au CODE HTML GENERE !!!!
    ► Au si c'est le cas et au à ceux qui vous ont aidé.
    Vous souhaitez participer aux rubriques CSS et (X)HTML ? Contactez-nous !

    Créer des colonnes de même hauteur en CSS
    Glossaire CSS
    Les bordures en CSS3
    Les transitions en CSS3

Discussions similaires

  1. font face nouvelle police sur dreamweaver
    Par ickyknox dans le forum Mise en page CSS
    Réponses: 7
    Dernier message: 26/06/2012, 18h35
  2. [CSS 3] @font-face et police de caractères payante
    Par Fused dans le forum Mise en page CSS
    Réponses: 1
    Dernier message: 18/04/2011, 14h47
  3. Réponses: 4
    Dernier message: 04/08/2006, 17h23

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo