Maison > interface Web > tutoriel HTML > Comment aligner le titre de l'article à gauche et la date à droite dans la balise LI

Comment aligner le titre de l'article à gauche et la date à droite dans la balise LI

巴扎黑
Libérer: 2017-04-05 16:47:47
original
2959 Les gens l'ont consulté

J'espère que le titre sera aligné à gauche et que la date sera alignée à droite. Lorsque float:right est directement ajouté à l'intervalle de date, IE8 et FF seront OK, mais IE6/7 enveloppera le contenu. ligne. Voici une solution simple et efficace.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   <title></title>
<style>
<!--

#mylist { width:400px; list-style-type:none; margin:0; padding:0; }
#mylist li span {
        float:right; 
}
--> 
</style> 
</head> 
<body> 
<ul id="mylist">

        <li><span>2011-12-2</span>Web开发者网络(Admin10000.com)</li>
        <li><span>2011-12-2</span>Web开发者网络(Admin10000.com)</li>
        <li><span>2011-12-2</span>Web开发者网络(Admin10000.com)</li>         
</ul>

</body> 
</html>
Copier après la connexion

Remarque : Vous devez écrire span devant la balise Li, afin que la date dans span puisse être alignée à droite dans les versions antérieures à IE6/IE7/FF3.5.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal