div 居中问题_html/css_WEB-ITnose
Jun 21, 2016 am 08:55 AM
该代码效果图如下:
我希望达到的效果如下:
回复讨论(解决方案)
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <style> #div1 { border:1px red solid; width: 100%; height: 570px; min-width: 1200px; } #div2 { border: 1px red solid; position: absolute; left: 50%; top: 285px; margin-left: -300px; background: url('/home/tpl/pc/img/bg1.png') repeat; width: 640px; padding-top: 20px; padding-bottom: 20px; padding-left: 40px; padding-right: 40px; border-radius: 8px; } </style></head><body> <div id="div1" > <div id="div2" > </div> </div> </body></html>
div2的宽和高都不能写死啊,div2的宽和高是根据它的内容动态变化的,div2的最大宽度等于div1的宽度,你都写死了,不行
我没说清楚,这是我的代码,各位给帮帮忙
<!doctype html><html lang="en"><head> <meta charset="UTF-8" /> <title> 页面名称 </title><style type="text/css">#div0 { display:table; width: 100%; min-height:735px;}#div1 { display:table-cell; vertical-align:middle; text-align:center; background-color: #999999;}#div2 { display:inline-block; text-align:center; background-color: #FFCCFF;}</style></head><body><div id="div0"><div id="div1"> <div id="div2"> <p>ggggggggggggggggggggggggggggggggggg</p> <p>ggggggggggggggggggggggggggggggggggg</p> <p>ggggggggggggggggggggggggggggggggggg</p> <p>ggggggggggggggggggggggggggggggggggg</p> </div></div></div></body></html>
就是这效果,谢了

Artikel Panas

Alat panas Tag

Artikel Panas

Tag artikel panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Kesukaran mengemas kini caching laman web akaun rasmi: Bagaimana untuk mengelakkan cache lama yang mempengaruhi pengalaman pengguna selepas kemas kini versi?

Bagaimana saya menggunakan atribut pengesahan borang html5 untuk mengesahkan input pengguna?

Apakah tujuan & lt; iframe & gt; Tag? Apakah pertimbangan keselamatan semasa menggunakannya?

Bagaimana cara menambah kesan strok kepada imej PNG di laman web?

Apakah tujuan & lt; meter & gt; unsur?

Apakah amalan terbaik untuk keserasian penyemak imbas dalam HTML5?

Apakah tujuan & lt; DATALIST & GT; unsur?

Apakah tujuan & lt; kemajuan & gt; unsur?
