Rumah hujung hadapan web html tutorial Css+Div在IE6上一些细小问题总结_html/css_WEB-ITnose

Css+Div在IE6上一些细小问题总结_html/css_WEB-ITnose

Jun 24, 2016 pm 12:32 PM

  好久没有做过Web开发了,最近做些css+div的页面设计工作还真有些不顺手,特别是有些东西在IE8上运行很正常,而在IE7和IE6上就离谱了。这里就一些ie6下不同之处做一下记录吧。

  1、Div做线条的问题

       在设计页面时有时候想用一个Div来模拟一条直线(某些情况是可以用Border和Padding等来实现的),给Div设置宽和高,并设置背景色或背景图,如:

#bottomLine
{
    background-color: Red;
    width:800px;
    height: 3px;
}

在IE8下确实显示的是一条高为3像素的红色横线,但在IE6下这条红线的高度远远超过3像素,好像有一个字体的高度。为了解决这个问题,加上overflow属性即可:

#bottomLine
{
    background-color: Red;
    width:800px;
    height: 3px;
    overflow:hidden;
}

2、多个div浮动在同一行

      有时候想在同一行显示多个DIV,可以先让右边的DIV靠右浮动,而最左边的那个DIV不浮动,在IE8下下面代码没问题:
      .divWrapper
      {
           width:800px;
           height:300px;
      }

      .divLeft
     {
         width:100px;
         height:300px;
         background-color:green;
     }

     .divRight
     {
         width:100px;
         height:300px;
         background-color:green;
         float: right;
     }
     .divCenter
     {
         width:600px;
         height:300px;
         background-color:Red;
         float:right;
     }

    


              
right div

              
center div

              
left div

    

     但在IE6下,这三个DIV在一行是显示不下的,会换成两行显示。在IE6下可以将所有DIV都左浮动或右浮动,改为如下则没有问题:

      .divWrapper
      {
           width:800px;
           height:300px;
      }

      .divLeft
     {
         width:100px;
         height:300px;
         background-color:green;
         float: right;
     }

     .divRight
     {
         width:100px;
         height:300px;
         background-color:green;
         float: right;
     }
     .divCenter
     {
         width:600px;
         height:300px;
         background-color:Red;
         float:right;
     }

    


              
left div

              
center div

             
right div

    
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Tutorial Java
1658
14
Tutorial PHP
1257
29
Tutorial C#
1231
24
Adakah HTML mudah belajar untuk pemula? Adakah HTML mudah belajar untuk pemula? Apr 07, 2025 am 12:11 AM

HTML sesuai untuk pemula kerana mudah dan mudah dipelajari dan dapat melihat hasilnya dengan cepat. 1) Keluk pembelajaran HTML adalah lancar dan mudah dimulakan. 2) Hanya menguasai tag asas untuk mula membuat laman web. 3) Fleksibiliti yang tinggi dan boleh digunakan dalam kombinasi dengan CSS dan JavaScript. 4) Sumber pembelajaran yang kaya dan alat moden menyokong proses pembelajaran.

Memahami HTML, CSS, dan JavaScript: Panduan Pemula Memahami HTML, CSS, dan JavaScript: Panduan Pemula Apr 12, 2025 am 12:02 AM

WebDevelopmentReliesOnhtml, CSS, andjavascript: 1) HtmlStructuresContent, 2) CSSStylesit, dan3) JavaScriptaddsInteractivity, Formingthebasisofmodernwebexperiences.

Peranan HTML, CSS, dan JavaScript: Tanggungjawab Teras Peranan HTML, CSS, dan JavaScript: Tanggungjawab Teras Apr 08, 2025 pm 07:05 PM

HTML mentakrifkan struktur web, CSS bertanggungjawab untuk gaya dan susun atur, dan JavaScript memberikan interaksi dinamik. Ketiga melaksanakan tugas mereka dalam pembangunan web dan bersama -sama membina laman web yang berwarna -warni.

Apakah contoh tag permulaan dalam html? Apakah contoh tag permulaan dalam html? Apr 06, 2025 am 12:04 AM

Anexampleofastartartingtaginhtmlis, yangbeginsaparagraph.startingtagsareessentialinhtmlasttheyinitiateelements, definetheirtypes, andarecrucialforstructuringwebpagesandconstructionthedom.

HTML, CSS, dan JavaScript: Alat penting untuk pemaju web HTML, CSS, dan JavaScript: Alat penting untuk pemaju web Apr 09, 2025 am 12:12 AM

HTML, CSS dan JavaScript adalah tiga tiang pembangunan web. 1. HTML mentakrifkan struktur laman web dan menggunakan tag seperti, dan sebagainya. 2. CSS mengawal gaya laman web, menggunakan pemilih dan atribut seperti warna, saiz font, dan lain-lain.

HTML: Struktur, CSS: Gaya, JavaScript: Tingkah Laku HTML: Struktur, CSS: Gaya, JavaScript: Tingkah Laku Apr 18, 2025 am 12:09 AM

Peranan HTML, CSS dan JavaScript dalam pembangunan web adalah: 1. HTML mentakrifkan struktur laman web, 2. CSS mengawal gaya laman web, dan 3. JavaScript menambah tingkah laku dinamik. Bersama -sama, mereka membina kerangka, estetika dan interaktiviti laman web moden.

Masa Depan HTML: Evolusi dan Trend dalam Reka Bentuk Web Masa Depan HTML: Evolusi dan Trend dalam Reka Bentuk Web Apr 17, 2025 am 12:12 AM

Masa depan HTML penuh dengan kemungkinan yang tidak terhingga. 1) Ciri -ciri dan piawaian baru akan merangkumi lebih banyak tag semantik dan populariti komponen web. 2) Trend reka bentuk web akan terus berkembang ke arah reka bentuk yang responsif dan boleh diakses. 3) Pengoptimuman prestasi akan meningkatkan pengalaman pengguna melalui pemuatan imej yang responsif dan teknologi pemuatan malas.

Masa Depan HTML, CSS, dan JavaScript: Trend Pembangunan Web Masa Depan HTML, CSS, dan JavaScript: Trend Pembangunan Web Apr 19, 2025 am 12:02 AM

Trend masa depan HTML adalah semantik dan komponen web, trend masa depan CSS adalah CSS-in-JS dan CSShoudini, dan trend masa depan JavaScript adalah webassembly dan tanpa pelayan. 1. Semantik HTML meningkatkan kebolehcapaian dan kesan SEO, dan komponen web meningkatkan kecekapan pembangunan, tetapi perhatian harus dibayar kepada keserasian penyemak imbas. 2. CSS-in-JS meningkatkan fleksibiliti pengurusan gaya tetapi boleh meningkatkan saiz fail. Csshoudini membolehkan operasi langsung rendering CSS. 3.Webassembly mengoptimumkan prestasi aplikasi penyemak imbas tetapi mempunyai keluk pembelajaran yang curam, dan tanpa pelayan memudahkan pembangunan tetapi memerlukan pengoptimuman masalah permulaan sejuk.

See all articles