ホームページ >ウェブフロントエンド >htmlチュートリアル >IE7と8chromeは1行、IE6は2行で表示されます it_html/css_WEB-ITnoseの修正方法。
IE7と8chromeは1行、IE6は2行で表示されます it_html/css_WEB-ITnoseの修正方法。
- WBOYオリジナル
- 2016-06-24 12:10:051601ブラウズ
コードは次のとおりです:
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><style>.row p,.row span{ font-size:14px; line-height:22px; color:#5e5e5e; display:block; float:left;}.span7 { width: 400px;}.span9 { width: 520px;}.row > [class*="span"] { display: inline; float: left; margin-left: 20px;}</style></head><body> <div class="row"> <div class="span9"> <h2>云DNS</h2> <p>DNSPod拥有全球最领先的云 DNS 集群技术。6年 DNS 领域专业研究，无数次紧急 DNS 故障处理，让我们更有信心提供最好的服务。</p> </div> <div class="span7"> <img style="margin-left:-20px;" src="https://www.dnspod.cn/yantai/img/content/features/feature1.jpg"> </div> </div> </body></html> IE7 や 8 chrome では同じように表示できますが、IE6 では 2 行で表示されます。
さらに、ここでの .row > [class*="span"] は何を意味しますか?ポイントは 64 しかありません。すべて貢献してくれました。ありがとうございます
ディスカッション (解決策) に返信します
.row > [class*="span"] div の下にあるspan で始まるすべてのクラス名class name row div
以上、上記のコードは IE7 と 8 chrome で同じように表示できました。 IE6では2行で表示できるのですが、どうすればIE6でも同じように表示できるのでしょうか？
ありがとうございます
これはcss3の書き方ですが、ie6はcss3をサポートしていないため、中の属性は機能しません。
tx isd css3 マニュアルを参照すると、次の結果が得られます:
[class*="span"] の意味: クラス内で単語 span を含むクラスを選択します。
この記事では、span7 とspan9 です。
そして > css3 マニュアルには関連する説明が見つかりませんでした。 Sharp jquery の説明 (36 ページ) によると、jquery セレクターの説明を参照してください。
サブセレクターは .a .b とは異なり、クラス a ではすべて .b です。 .a>.b は、.a の下に .b が 1 つだけ存在することを意味します。一般的には、孫ではなく息子のみを検索します。
以上、上記のコードは IE7 と 8 chrome で同じように表示できます。 IE6では2行で表示されるのですが、どうすればIE6でも同じように表示できるのでしょうか？
ありがとうございます
先ほどの束を捨てて、次のように変更するのは非常に簡単です:
.row .span7,.row .span9
変更後:
.row p,.row span{ font-size:14px; line-height:22px; color:#5e5e5e; display:block; float:left;}.span7 { width: 400px;}.span9 { width: 520px;}.row .span7,.row .span9 { display: inline; float: left; margin-left: 20px;} [class*="span"] の意味: select class 単語「span」を含むクラスが含まれます。
この文はより正確です:
要素をクラス属性とその値の 'span' に一致させます。
うわー、今はっきりと自分のことを表現できなかったので、投稿を編集したいのですが編集できません
以上、上記のコードは同じように表示できます。 IE7や8のChromeでは2行で表示されるのですが、IE6でも同じように表示するにはどうすればよいでしょうか？
ありがとうございます
先ほどの山を捨てて次のように変更するのは非常に簡単です:
.row .span7,.row .span9
変更後:
CSS コード
.row p,.row scan{
フォ…
ありがとう！