html 列表内边距不对称_html/css_WEB-ITnose-html tutorial-php.cn

Rumah

hujung hadapan web

html tutorial

html 列表内边距不对称_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jun 24, 2016 pm 12:15 PM

我建立了一个列表然后左浮动LI 我把列表的外边距和内边距以及LI 的内外边距都设成0PX了但是呢 LI 里面的文字在垂直方向现实的不对称也就是上内边距很小有1PX左右吧下内边距却有3PX 这么大看上去很别扭边距都清零了没有用啊这么解决呢？、各位帮帮忙

回复讨论(解决方案)

可以去年看看css兼容方面和hack相关的文章就可以找到答案了。

前面style加 * {margin:0;padding:0} 了吗？

我列表和列表元素全设置成内外边距为0了设置全局的也没用啊

我按照楼主的所说的写了个，没有遇到类似的问题啊，你是不是在列表里面又嵌套了标签了啊，如果真像楼主所说的这种现象，你可以在li里面设置定位，如：

          li{                position: relative;                top: 2px;            }

我给楼主整理了下，希望能帮到楼主！

<!DOCTYPE html><html>    <head>        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">        <title>test</title>        <style>            .mainContent{                position: absolute;                top: 10px;                left: 300px;                width: 245px;                height: 200px;            }            ul{                padding: 0;                margin: 0;                float: left;            }            li{                float: left;                list-style: none;                margin-left: 2px;                cursor: pointer;                border: 1px solid red;                /*如果还遇到楼主所说的可以用以下的试试*/                /*position: relative;*/                /*top: 2px;*/            }            li:hover{                background-color: blue;            }         </style>    </head>    <body>        <div class="mainContent">            <ul>                <li>首页</li>                <li>用户管理</li>                <li>角色管理</li>            </ul>        </div>    </body></html>

你的li太高了
有三种方法，把li调低点或把字体调大点或设line-height等于li的高度

你的li太高了
有三种方法，把li调低点或把字体调大点或设line-height等于li的高度
li 的高度跟 line-height 高度同高

没有贴代码出来呀~~~~

这个问题嘛...我经常出现. 解决也非常容易. 会用positon ：relative; 这个不 ,然后 top :0px; left :0px ；上面的top left 中的0px ,是根据你自己要的的位置自己定义的。而且这个position是在任何浏览器兼容的 . 至于你上说的li 里面float 这个别的浏览器出现兼容问题。也就是说出现错位的情况。那怎么解决就用 css hack 下就可以了

其实大家说的我知道但是相对定位定位的事LI 的位置我说的是在LI里面的字相对于LI 这个框的上下位置不对称而并非 LI的位置不对称就是LI 里面的字可能是浏览器兼容的问题吧我看百度什么的大网站也有这种情况

哦,我知道了你说什么了...我随便举个例子

aaa

你是说aaa的位置调不好是吧
这样

aaa

再 .zi{
position ：relative;
left://多少px
top://多少px
}
这样可以懂了...

楼上的方法似乎可以但是导致这样的原因究竟是什么呢我看一些大的网站上面你全选页面的文字也会发现有这样的现象怎么回事呢

position ：relative; 我以前也遇到过，是这个position ：relative;原因。

虽然得到分了...但是还是和你说下原因...

不是position 的原因知道不...

是float 这个词的原因，在火狐和谷歌里面 float的时候不会怎么变化...在ie中 float时候出现了错位..就是你说的这情况

Kenyataan

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

Artikel Berkaitan

HTML: Membina struktur laman webApr 14, 2025 am 12:14 AM

HTML adalah asas struktur laman web bangunan. 1. HTML mentakrifkan struktur kandungan dan semantik, dan penggunaan, dan sebagainya. 2. Menyediakan penanda semantik, seperti, dan sebagainya, untuk meningkatkan kesan SEO. 3. Untuk merealisasikan interaksi pengguna melalui tag, perhatikan pengesahan bentuk. 4. Gunakan elemen lanjutan seperti, digabungkan dengan JavaScript untuk mencapai kesan dinamik. 5. Kesilapan biasa termasuk label yang tidak terkawal dan nilai atribut yang tidak disebutkan, dan alat pengesahan diperlukan. 6. Strategi pengoptimuman termasuk mengurangkan permintaan HTTP, memampatkan HTML, menggunakan tag semantik, dll.

Dari teks ke laman web: Kekuatan HTMLApr 13, 2025 am 12:07 AM

HTML adalah bahasa yang digunakan untuk membina laman web, menentukan struktur laman web dan kandungan melalui tag dan atribut. 1) HTML menganjurkan struktur dokumen melalui tag, seperti,. 2) Penyemak imbas menghancurkan HTML untuk membina DOM dan menjadikan laman web. 3) Ciri -ciri baru HTML5, seperti, meningkatkan fungsi multimedia. 4) Kesilapan biasa termasuk label yang tidak terkawal dan nilai atribut yang tidak disebutkan. 5) Cadangan pengoptimuman termasuk menggunakan tag semantik dan mengurangkan saiz fail.

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

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

Peranan HTML: Penstrukturan Kandungan WebApr 11, 2025 am 12:12 AM

Peranan HTML adalah untuk menentukan struktur dan kandungan laman web melalui tag dan atribut. 1. HTML menganjurkan kandungan melalui tag seperti, menjadikannya mudah dibaca dan difahami. 2. Gunakan tag semantik seperti, dan lain -lain untuk meningkatkan kebolehcapaian dan SEO. 3. Mengoptimumkan kod HTML boleh meningkatkan kelajuan pemuatan laman web dan pengalaman pengguna.

HTML dan Kod: Melihat lebih dekat pada istilahApr 10, 2025 am 09:28 AM

Htmlisaspecifictypeofcodefocusedonstructuringwebcontent, manakala "kod" secara meluas ini

HTML, CSS, dan JavaScript: Alat penting untuk pemaju webApr 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.

Peranan HTML, CSS, dan JavaScript: Tanggungjawab TerasApr 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.

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.

See all articles