ホームページ > ウェブフロントエンド > htmlチュートリアル > 互換性の問題 (pc css)_html/css_WEB-ITnose

互換性の問題 (pc css)_html/css_WEB-ITnose

WBOY
リリース: 2016-06-24 11:47:36
オリジナル
1138 人が閲覧しました

记录平时遇见的兼容性问题,有更好的解决办法希望各位提出,会持续更新

2014/9/26幅不定の水平方向のセンタリング (ページングによく使用されます)親要素の相対的な配置を使用します>コンテナ要素の絶対左:50%> ターゲット要素の相対左:-50% (または右:50%) は位置決めの脆弱性の実装です 2014/10/152014/9/272014/10/162014/10/242014/10/24入力ボックスと画像が水平線上にありません、vertical-align:middle、ブラウザによって解釈が異なります(ie7-8) ずれが生じます同じことを説明するにはvertical-align:topブラウザを使用してください、ただし、画像の高さと入力ボックスの高さが同じである必要があることに注意してください2014/10/30サーバーのレンダリングCSSにズレが発生します2014/11 /3ie6 は異なるエンコーディングの CSS を読み込むことができませんCSS エンコーディングを変更する2014/11/3ie6 には浮動 div の固定幅がありません。右側の浮動改行が表示されます対応する幅を追加します左側のフローティング div2014/11/4div と Section の違いsection の方が意味論的で、記事の分割やコンテンツの一部に適しています 違いはありますが、div を使用することをお勧めします2014/11/7親要素が幅と高さを追加しないため、ie6の左下の絶対配置は無効ですzoom:1を使用してレイアウトをトリガーするか、親要素を追加します 高さまたは幅は解決できます 2014/11/8文字行の折り返し IE では word-wrap:break-word を使用します。すべて正常です。 通常、word-wrap:break-word;word-break:break-all; を使用すると、英語と英語の単語の長い文字列が切断されます。使用: overflow:auto; つまり、長い文字列は自動的に折り返されます。 ff、長い文字列はカバーされます。 word-wrap:break-word;overflow:hidden;2014/12/25text-align:justify! important;// text-justify:distribute-all-lines; / /ie用に実装.classify_item{display:inline-block;width:592px;height:400px;} .classify_item_ie{*display: inline } liclass="classify_itemclassify_item_ie" display:inline-block; *zoom:1; 非テキスト オブジェクトの 1 つのスタイルに追加します: margin: (コンテナの行の高さ - オブジェクト自体の高さ)/2px0; を設定します2015/1/5ie6-7overflow:hiddenは無効です親要素にオーバーフローがあっても:隠しセット。 パディングを使用、js Redrawを使用、(再レンダリングスタイルを強制するスタイルを追加) に設定します 親要素はposition:relativeを設定します浮動要素は高さを定義する必要があります、そうしないと、自動高さ分析が正しく行われません a label height: 100% width: 100%; 2015/3/17123|123 この効果の margin-left: -1 が最外層オーバーフロー: 非表示は無効です 効果を発揮するには、対応する層がブロック、ブロック、またはインラインブロックである必要があります2015/3/19dl浮動リストの2行目の最初の要素がie7で展開されました IE7は高さを定義する必要があります2015/3/21最後の浮動要素IE7 はラップします 要素がwhite-space:nowrap;をラップしないように強制する必要があります再印刷するために元のアドレスを保存してください、ありがとうございます
提出时间 问题描述 解决方案
2014/7/15 table下面使用img或者其他元素例如embed会产生,对应的空隙,假如使用文字缺不会发生上述问题. 方法1:可以使用怪异模式进行解析html,不建议(把!doctypehtml去掉
方法2:设置对应的元素的css;设置为块状元素或者浮动,具体帖子http://blog.csdn.net/fgdfgasd/article/details/7979763
2014/7/15 ie不支持tr设置background 使用td设置background(不推荐),使用css把tr设置background来的方便
  为什么FF下文本无法撑开容器的高度 标准浏览器中固定高度值的容器是不会象IE6里那样被撑开的,
办法就是去掉height设置min-height:200px;   
这里为了照顾不认识min-height的IE6 
可以这样定义:{height:auto!important;height:200px;min-height:200px;}
  怎么样才能让层显示在FLASH之上呢  FLASH设置透明 解决的办法是给FLASH设置透明或者
  为什么web标准中IE无法设置滚动条颜色了 将body换成html,去掉doctype声明,进入怪异模式
  超链接访问过后hover样式就不出现的问题  被点击访问过的超链接样式不在具有hover和active了,改变CSS属性的排列顺序:L-V-H-Aa:link,a:visited,a:hover,a:active{}  
  ie6中超链接加入边框显示不全 加入display:block,变为块状元素;zoom:1
  ie6元素存在确不显示出来 父亲元素添加 overflow:hidden;zoom:1; 
ie6下浮动及绝对定位元素莫名消失的问题
在最后加入一个清浮动的div(CSS:.clear{clear:both;height:0;overflow:hidden;}HTML:),在绝对定位的元素前加入一个空divhttp://blog.163.com/hongshaoguoguo@126/blog/static/1804698120127934226128/
display: inline-block 要素を同じ水平方向に配置することはできませんline は、marginpadding を使用して調整することはできません 隣接する要素vertical-align:top を設定して上部を揃えてから、-px を使用して画像を微調整します
margin の場合、ホバーは効果がありません。 -1px 、z-indexの設定は機能しません position:relativeを使用してホバー要素を表示します
幅をカスタマイズした全画面レイヤーを実現します position:absoluteを使用して作成しますfloat, left: 0top:0 にして、margin-left: - 画像幅の半分を使用します
thead がテーブルに境界線を設定した後、tbody は js を呼び出して境界線を設定しません。要素を非表示にしたり表示したりすると、Firefox tbody が境界線をレンダリングします デフォルトは td に背景色の境界線を加えたもので、境界線を切り替えます
line-height は植字に影響します、( Googleの影響もありますが、float:leftの後は左側を空白のままにしてください 子要素は親要素のline-heightを継承するため、ブラウザの解析により問題が発生する可能性がありますので、line-heightを1またはnormalで使用するのが理想的です。 line-height:1.5font-size:10px; は line-height:1.5font-size:10px; であるため、解決策は、対応する要素の line-height を標準に設定するか、フォント サイズを小さいサイズに変更することです。 height:15px; 実際、line-height を変更すると、レイアウトが変更されます。推奨されません。

テキストの配置
2014/12/25 ie6-7トリガーinline-block
*display:inline;


2015/1/4

ie6では、textとimgのとき、input、textareaのとき、select、object、およびその他のオブジェクトが同じコンテナ内にある場合、line-height 属性は無効です。
line-height 属性は全文に対してのみ有効です。

2015/1 /5
clearfixはfloatをクリアして高さを自動的にレンダリングします

外部要素はoverflow:hidden;
このバグを解決するのは非常に簡単です
2015/1/6 ie6-7li ネストされた ul にパディングがあります 親要素に *zoom を追加します。 li of ul :1 は haslayout をトリガーします
2015/1/12 iecss3htc path.iecss{behavior:url(htc/pie.htc);} パスはプロジェクトのルート ディレクトリ パスであり、 css../ htc/pie.htc を呼び出すときに使用する必要があります。 htc/pie.htc を直接指定できます。消失
2015/1/14 ie6-7 親要素はoverflow:hiddenに設定されており、これは、子要素をposition:relative
2015/3/5 IE7では、浮動要素の2行目の最初の要素はラップされます
2015/3/5 ie7 の li の下のラベルの表示: block と li の間にギャップがあります

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート