preタグを自動的に折り返すためのサンプルコード

preタグを自動的に折り返すためのサンプルコード
pre 要素は、フォーマット済みのテキストを定義します。 pre 要素で囲まれたテキストでは、通常、スペースと改行が保持されます。テキストも等幅フォントで表示されます。
<pre> タグの一般的な用途は、コンピュータのソース コードを表すことです。技術ブログでは、コードを出力したり、コードを強調表示したりするために、pre タグがよく使用されます。デフォルトでは、pre タグ内のコンテンツは、範囲を超えても自動的に折り返されません。
<pre> タグ内のコンテンツを自動的に折り返し、W3C 標準に準拠させる方法は次のとおりです (複数のブラウザでサポートされています)

コードをコピー
コードは次のとおりです。

前{
white-space:pre-wrap; /* css3.0 */
white-space:-moz-pre-wrap; /* Firefox */
white-space:-pre-wrap; /* Opera 4-6 */
white-space:-o-pre-wrap; /* Opera 7 */
word-wrap:break-word; /* Internet Explorer 5.5+ */
}

例:

コードをコピー
コードは次のとおりです。

pre{white-space:pre-wrap; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word; /*これは非常に長いコードです。コードを折り返しているのがわかりますか? */

<<:  MySQL テーブル結合クエリでグループ化と重複排除を実装する例

>>:  JavaScript配列の一般的なメソッドの詳細な説明

推薦する

よく使われるnginxの書き換えルールの詳細な説明

この記事では、Web ページのリンクを美しくするためによく使用される書き換えルールをいくつか紹介しま...

UIエンジニアのキャリアについての私たちの考え

私は長い間落ち込んでいます、なぜでしょうか?以前、お客様から、提供されたソフトウェアが正常に動作しな...

ディスクを破壊せずに Linux で dd コマンドを使用する方法

故障したストレージ ドライブからデータを救出する場合でも、アーカイブをリモート ストレージにバックア...

MySQL 8の新機能である降順インデックスの基礎となる実装の詳細な説明

降順インデックスとは何ですか?インデックスについてはよくご存知かもしれませんが、降順インデックスにつ...

ウェブページ上の写真プレビューナビゲーションを設計するためのヒント

<br />ナビゲーションとは、ウェブサイトの上部にあることが多いナビゲーション バーの...

Centos6にMysql5.7をインストールする方法

環境セントロス6.6 MySQL 5.7インストールシステムがインストールされている場合は、まずアン...

MySQL の JSON 挿入の問題

MySQL 5.7.8 以降では、JSON テキストでデータを効率的に取得できるネイティブ JSON...

IE6かどうかを判定する最短JS(IEの書き方)

ブラウザが IE のどのバージョンであるかを検出するためによく使用される JavaScript コー...

VMware ESXi 6.0 および仮想マシンのインストール チュートリアルの展開 (画像とテキスト)

社内には以前からアイドル状態だった、構成の整ったサーバーがあったので、EXSI 6.0 を使って複数...

Windows での MySQL 8.0.11 インストール チュートリアル

この記事は、WindowsでのMySQL 8.0.11のインストールチュートリアルを記録しています。...

Linux での Jenkins の詳細なインストール手順

目次1. JDKをインストールする2. Jenkinsをインストールする3. Jenkinsの設定を...

Reactは適応性の高い仮想リストを実装する

目次変換前:変換後: 0x0の基本0x1 「固定高さ」の仮想リストを実装する原理:最適化: 0x2 ...

SSHを使用してDockerサーバーに接続する方法

初めて docker に触れたときは本当に戸惑いました。初心者向けのチュートリアルを長い間読みました...

実行後にdocker nginxにアクセスできない問題の解決策

## 1最近、docker デプロイメントを学習しており、当初は nginx を docker 化す...

Nginxのアクセス制限設定の詳細な説明

Nginxのアクセス制限設定とはNginx のアクセス制限は、IP ベースのアクセス制御とユーザーベ...