Web UI(DPI问题) - ITeye问答

0 0

Web UI(DPI问题)10

最近在做web项目，主要使用css+html搭建UI,设计Web UI考虑浏览器和分辨率的问题是理所当然的，但是，有一个属性DPI(右键桌面->设置->高级)有正常(96DPI),大尺寸(120DPI)和自定义这几个选项。我们项目的界面在正常(96DPI)下排版正常，但是在大尺寸(120DPI)下就会出现局部地方混乱的情况，大家有谁遇到过这种问题，谈谈自己的经验吧。（关于WEB UI设计的也行）
问题补充

xiaog 写道

既然有css控制字符大小怎么会有这个问题，不解。
我倒是有个困扰很久的问题，就是一个固定列宽的div如何嵌套在一个自适应列宽的table里

css虽然能控制字符大小，例如你设定font-size:12px;但是不同DPI机器上的显示的字的大小还是不同的。这个跟样式没关。
还有你说的那个问题，可能是我没理解好你的意思，我理解你的问题就是在一个Table（列宽可变）里放一个固定宽度的DIV
我觉得没什么问题吧。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Untitled Document</title>
		<style type="text/css">
			#myDiv {
				background-color:red;
				width:200px;
			}
		</style>
    </head>
    <body>
        <table width="100%" border="1" height="200">
            <tr>
                <td>
                    1
                </td>
                <td>
                    <div id="myDiv">
                    	hello
                    </div>
                </td>
            </tr>
        </table>
    </body>
</html>

这个是你说的问题吗？

问题补充

xiaog 写道

prothi 写道

这个是你说的问题吗？

不是的，是内部div很宽会把外部自适应的table顶宽
其实我是想要一个外框宽自适应，内框宽大于外框时变成拖动条。内框是div，外框随便。
还有我改了DPI，没发现css控制的页面字体大小有变化，是我机器问题么？还是要重启？

那个DPI是重启之后才生效的~
然后我试过你说的问题，这个我想需要借助于js来实现，一方面，如果内框想出现滚动条，就必须设定一个设定一个固定的宽度，而不能是100%之类的，而要想实现外框自适应，内框的宽度又只能用百分比来写。所以这里应该有js来控制一下：当外框宽度改变之后(监听)，将内框(DIV)的宽度改为外框(Table)的宽度（一个值而不是百分比），然后将内框DIV的样式写成overflow:auto;就应该可以了。我觉得是这样的~

界面设计