ASP.NET:GridViewの一般改行と強制改行

2869 ワード

今日GridView改行の問題に遭遇しました.図のように解決策を探してください.
まず、ページのプロパティを設定します.
コメント内容列はバインドされたデータが長く、表示されると1行に表示され、ページが広がります.内容を改行するには、この列のRowDataBoundに次の文を追加するだけです.
e.Row.Cells[2].Style.Add("word-break", "break-all");できます
または、データバインド時に次のように設定します.
this.GridView1.Rows[i].Cells[1].Style.Add("word-break", "break-all");
すべての列に改行機能を追加する場合は、ページの読み込み時にプロパティを設定できます.
protected void Page_Load(object sender, EventArgs e)    {        this.GridView1.Attributes.Add("style", "word-break:keep-all;word-wrap:normal");        this.GridView1.Attributes.Add("style", "word-break:break-all;word-wrap:break-word");               if (!IsPostBack)        {            this.commentBind();        }    }
要するに:CSSのword-break:break-allをよく使う;word-wrap:break-word属性でよいが,この属性はGridViewに限らず,頑固な南改行問題に対して汎用的に解決できる.
//通常改行
   GridView1.Attributes.Add("style", "word-break:keep-all;word-wrap:normal");
//次の行は自動改行
   GridView1.Attributes.Add("style", "word-break:break-all;word-wrap:break-word");
divでは、テキストレイアウトが頻繁に発生し、改行が混乱する場合があります.
問題表現:1.全英語文字列の場合、中央にはスペースを含む記号は含まれず、自動的に改行されません.
          2.中国語と英語が混在している場合は、英語文字列の先頭で改行(英語長>div長)し、末尾で改行しません.
          3.英語の単語全体を改行する.など、いくつかの問題があるかもしれませんが、ここにはよくあるいくつかしかリストされていません.
上のいくつかのcss属性機能の簡単な使い方を紹介します.
word-wrap:normal | break-word; (内容改行)
normal:デフォルトのプロパティ値.(コンテンツが指定するコンテナの境界を開くことを許可する).
break-word:コンテンツは境界内で改行されます(英語の単語の改行を遮断せず、英語の単語の下の属性を遮断してこそこの機能が備えられます.)  
word-break:normal|break-all|keep-all(語内改行)
normal:中国語であれば境界までの漢字の改行、英語全体の改行であれば、ある英語文字列の長さが境界を超えると、後ろの部分が枠を広げ、枠が固定属性であれば後ろの部分は表示できないことに注意する.
break-all:強引に改行し、英語の単語を遮断します
keep-all:ワードブレークは許可されていません.中国語であれば前後の句読点の中の漢字のフレーズを改行し、英語の単語も改行します.注意:ある英語が現れたら.文字列の長さが境界を超えると、後ろの部分が枠を開く、枠が固定属性の場合、後ろの部分は表示できない.
text-overflow:clip|ellipsis(テキストオーバーフロー)
clip:省略フラグは表示されません(...)、簡単な裁断です
Ellipsis:オブジェクト内のテキストがオーバーフローした場合(widthを超える部分)省略フラグが表示されます(...)
white-space:normal|pre|nowrap(内容は改行しない)
normalデフォルト.空白はブラウザに無視されます.
preの空白はブラウザに保持されます.その動作はHTMLの

nowrap , ,

( , float:none   , style white-space: nowrap)

: word-break:break-all;
:
.body{
       word-wrap:break-word;
       word-break:keep-all;
       overflow:hidden;
}
.css{
      text-overflow:ellipsis;
      white-space:nowrap;
      overflow:hidden;
}

IE Firefox , 。
IE, IE CSS word-wrap :word-wrap:break-word;
Firefox,CSS2 word-wrap , overflow :overflow:hidden
に似ています