HTML での Li タグの使用例

HTML での Li タグの使用例

タイトルを左に、日付を右に揃えたいのですが、日付の範囲に float:right を直接追加すると、IE8 と FF では問題ありませんが、IE6/7 では折り返されてしまいます。ここでは、シンプルで効果的な解決策を紹介します。

XML/HTML コードコンテンツをクリップボードにコピー
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >     
  2. < html   xmlns = "http://www.w3.org/1999/xhtml" >     
  3. <ヘッド>   
  4.     <メタ  http-equiv = "コンテンツタイプ"  コンテンツ= "text/html; 文字セット = utf-8"   />   
  5.     <タイトル> </タイトル>   
  6. <スタイル>   
  7. <!--
  8.   
  9. #mylist { 幅:400px; リストスタイルタイプ:なし; 余白:0; パディング:0; }
  10. #mylist li span {
  11. フロート:右;
  12. }
  13. -- >     
  14. </スタイル>     
  15. </ヘッド>     
  16. <本文>     
  17. < ul   id = "マイリスト" >   
  18.   
  19.          < li > < span > 2011-12-2 </ span > Web 開発者ネットワーク (Admin10000.com) </ li >   
  20.          < li > < span > 2011-12-2 </ span > Web 開発者ネットワーク (Admin10000.com) </ li >   
  21.          < li > < span > 2011-12-2 </ span > Web 開発者ネットワーク (Admin10000.com) </ li >             
  22. </ ul >   
  23.   
  24. </本文>     
  25. </html>     

注: span は Li タグの先頭に記述する必要があります。これにより、IE6/IE7/FF3.5 より前のバージョンでは、span 内の日付が右揃えになります。

<<:  Docker ベースのよく使われる CentOS7 イメージの概要

>>:  MySQL の時間タイプとモードの詳細

推薦する

DockerコンテナのIPアドレスを表示する方法

私はずっとDockerにはIPアドレスがないと思っていました。実はDockerのネットワークテンプレ...

シンプルな加算計算機の JavaScript 実装

この記事では、参考までに、加算計算機を実装するためのJavaScriptの具体的なコードを紹介します...

CSSフロートの特性についての簡単な説明

この記事では、CSS フロートの特徴を紹介します。皆さんと共有し、自分用のメモとして残したいと思いま...

mysql 結合クエリ (左結合、右結合、内部結合)

1. MySQLの一般的な接続INNER JOIN (内部結合、または等価結合): 2 つのテーブ...

Linux ネットワークプログラミングにおけるソケットオプションの実装

ソケットオプション機能機能: ソケットファイル記述子の属性の読み取りと設定に使用されるメソッド #i...

IE6 での PNG アルファ透明度 (完全コレクション)

IE6 は PNG の透明度をサポートしていないと多くの人が言っています。実際、IE は 100%...

表のセルの内容が超過した場合に省略記号効果を表示する(実装コード)

例示するフロントエンド開発では、セルの幅を制限し、コンテンツが制限を超える部分に省略記号を表示する必...

React-Dropzone をベースにアップロードコンポーネント機能を開発する (サンプルデモ)

今回はReact-Flaskフレームワーク上でアップロードコンポーネントを開発するスキルについてお話...

mysql8.0.12 でルートパスワードをリセットする方法

データベースをインストールした後、誤ってインストール ウィンドウを閉じたり、長期間 root ユーザ...

美容・スタイリングウェブサイト向けのカラーマッチングテクニックと効果表示

色はあらゆるウェブサイトにとって最も重要な要素の 1 つであり、閲覧者に大きな影響を与えるため、色の...

Pycharm2017はpython3.6とmysqlの接続を実現します

この記事では、pycharm2017でpython3.6とmysqlを接続する方法を参考までに紹介し...

初心者向け入門講座⑧:記事サイトを簡単に作る

前回の投稿では、Web ページの作成方法について説明しました。Web サイトは多くの Web ページ...

Linux MySQL ルートパスワードを忘れた場合の解決方法

MySQL データベースを使用する際、何らかの理由で長期間 MySQL にログインしていない場合、ま...

JavaScript の Set データ構造の詳細な説明

目次1. セットとは何か2. セットコンストラクタ2.1) 配列2.2) 文字列2.3) 議論2.4...

Samba を使用して Linux サーバー上で共有ファイル サービスを構築する方法

最近、私たちの小さなチームは、サーバー上の共有フォルダーを共有して、全員がパブリックリソースドキュメ...