28172 sujets

CSS et mise en forme, CSS3

[Résolu] Récupérer le contenu d'une balise

Bonjour.

Je travaille sur un site web et j'aimerais appliquer le concept de "sémantique presque parfaite". Je me suis penché sur la question du titre du site, et du titre de la page.

Le titre du site, je l'affiche dans une bannière d'arrière-plan pour ne pas déranger la sémantique du code xhtml. Jusque là, tout va bien.

Cependant, le titre de la page est théoriquement (dans ma théorie en tout cas) placé dans la balise <title> de l'élément <head>
La balise <h1> se réfère à un titre d'ordre 1. J'aimerais ne pas utiliser cette balise pour indiquer le titre de ma page, mais bien pour une (ou plusieurs) sous-section(s).

Ainsi, il m'est passer par la tête la réflexion suivante: "Et si, par le jeu des feuilles de style, je pouvais récupérer le contenu de ma balise <title> et l'ajouter à un bloc <div> par les sélecteurs :before et :after.
Je sais que c'est possible pour un attribut (récupérer le contenu de l'attribut hreflang d'un lien pour l'ajouter au contenu de ce lien, pour que le navigateur graphique l'affiche).

Est-ce possible dans mon cas ?
Le code ressemblerait à ceci:
div#unCertainDiv:after {
content: contenu_de_la_balise_title_dans_head;
...
}


Est-ce possible ? Dois-je me rabattre sur du JavaScript ?

Merci de votre aide.
Justin
Modifié par just1dks (07 Dec 2008 - 09:49)
Modérateur
bonjour,

Ce qui est possible de placé dans un content , c'est une image:

div#machin:before {
content:url(chemin/image.gif);
}


Il est aussi possible d'afficher le title directement dans la zone visible de ta page et de lui attribué :after ou :before avec texte ou image.

Cependant , Tout les navigateurs n'y sont pas receptifs et les contenus ajouté par css (ou javascript) a un document quelconque n'existes pas vraiment .
Ces document ne se trouvent modifié qu'en consultation si js ou css sont supporté.

Il me semble même qu'en ajout de texte ou image en css , ceux-ci ne serait pas selectionnable a la souris ?

Voici 2 pages tests ou je joue avec cette particularité d' affiché le title et de lui adjoindre du 'content' CSS.
http://gcyrillus.free.fr/trucs_css/limiter-la-copie.html
http://gcyrillus.free.fr/essai/boiteleien.html
ou un gabarit auquel on ajoute du contenu et un fond avant et aprés body.
http://gcyrillus.free.fr/essai/test-decoupe-finale.html
Amusant mais ne passe pas dans IE ou du moins le document n'est pas modifié .

Du coup le js semblerait necessaire pour
1) récuperer le contenu de title
2) créer a la volé une balise dans laquelle tu réinjecte ton title .

Mais pourquoi perdre le titre dans la partie body de ton document , pour ensuite tenter de systématiquement l'y réintegrer ?
Un simple 

....
<body>
<!--rappel discret en dure du titre de ma page ou de mon site 
qui peut aussi servir de fil d'arianne --> 
<p> SITE: Page </p>
<h1>Section 1 de ma page</h1>
....

De cet façon, la reprise de titre de site / page , ne prend pas plus de poids qu'au travers d'un content , mais existe partout Smiley smile .

Cependant , Je n'ai peut-etre pas bien saisi ta problématique .

GC

<edit>
(par habitude le h1 est utilisé pour affiché le titre de la page et ou du site , car c'est la première balise vraiment visible partout.
sinon , le titre du site et de la page peuvent déjà être en partie dans l'url.
http://monsite.com/index.php -> title(MonSite : Index) ->h1 (monsite : Index ).

</>
Modifié par gcyrillus (07 Dec 2008 - 01:17)
Merci beaucoup pour ces pages à consulter, que je vai lire de suite ! ^^

En fait le problème était juste de placer dans les navigateurs graphiques le titre de la page, car les utilisateurs sont plus habitués à voir le titre de la page (tout comme le titre du site) dans l'espace visible du document.

Ainsi, selon mes sources (que j'ai perdues malheureusement), placer une alternative à la balise <title> par le biais des sélecteurs CSS et une alternative au titre du site (sous-entendu, dans un document "en règle" (toute subjectivité ici)) permet aux utilisateurs "graphiques" de garder des points de repères visuels.

Aucun élément n'est ajouté au XHTML, donc pas de problème de sémantique (selon moi).

Le problème du tout-le-monde-ne-peut-pas-lire n'est pas très grave. En effet, aucune perte réelle ne sera impliquée. L'ajout de ces deux titres sont purement facultatifs.

Donc voila. Je me disais que pour ceux qui savaient l'afficher, c'était très bien; que rendre un site plus sémantique pouvait peut-être donner envie à certains webmasters de faire pareil; c'était un bon exemple de la puissance des CSS lol

Merci encore
Ok j'ai lu les articles et leur CSS

Intéressants mais peu appliquables à mon gabarit Smiley ohwell

En fait, à la place d'afficher le <title> dans la page, il faudrait qu'il s'insère (que son contenu s'insère) dans le container div#machin.

Le code général html est le suivant:
<html>
<head>
<title>Le titre de la page</title>
</head>
<body>
<div class="premier">
...
</div>
<div class="second">
...
</div>
<div class="iciEssentiel">
<!-- Ici devrait être inséré le contenu de la balise <title>
...
</div>
</body>
</html>

Quelqu'un peut-il m'éclairer ? Smiley ohwell
Modifié par just1dks (07 Dec 2008 - 01:29)
Modérateur
bonsoir,

Peut-etre y a t-il confusion avec ce que tu veut faire et ce qui est possible en css ?

Tu peut inserer avec content ''; le contenu de l'attribut title de la balise concerné,
... mais je n'ai rien lu ou vu qui permettait d'insere le contenu d'une autre balise .

CSS est a la base un langage de mise en forme .

Il me semble que tu devra te tourner vers un javascript. Au moins , cela aura l'avantage de marcher aussi dans IE.

GC
Salut,

Merci merci pour ton post

Non je ne me suis pas embrouillé dans le rôle, la fonction, des CSS. J4ai juste cru que si récupérer la valeur d'un attribut était possible, peut-être récupérer le contenu d'une autre balise l'était aussi.

Je m'oriente donc vers un JavaScript.

Justin
Sujet clos
Aller à