解决JQeury显示内容没有边距内容紧挨着浏览器边线
发布时间：2014-06-03 编辑：jiaochengji.com
JQuery页面显示的内容没有边距，内容紧挨着浏览器边线，下面有个不错的解决方法，大家可以尝试下
写的jquery页面显示的内容没有边距，内容紧挨着浏览器边线，特别难看（如下图）
代码如下：
<body>
<form id="form1" runat="server">
<div data-role="page" id="page">
<div data-role="header" data-theme="b">
<h2>新闻内容</h2>
</div>
<div>
<div>
<asp:Image ID="newsImage" runat="server" AlternateText="新闻图片" />
</div>
<div>
<asp:Label ID="lblDetail" runat="server" Text="Label"></asp:Label>
</div>
</div>
<div data-role="footer" data-theme="d">
<h4>餐饮咨询</h4>
</div>
</div>
</form>
</body>
其实原因特别简单，就是显示的内容没有放在content里边，所以在div里加一个data-role="content"就可以了，修改后的代码如下：
<body>
<form id="form1" runat="server">
<div data-role="page" id="page">
<div data-role="header" data-theme="b">
<h2>新闻内容</h2>
</div>
<div>
<div>
<asp:Image ID="newsImage" runat="server" AlternateText="新闻图片" />
</div>
<div>
<asp:Label ID="lblDetail" runat="server" Text="Label"></asp:Label>
</div>
</div>
<div data-role="footer" data-theme="d">
<h4>餐饮咨询</h4>
</div>
</div>
</form>
</body>
代码如下：
复制代码 代码如下:
<body>
<form id="form1" runat="server">
<div data-role="page" id="page">
<div data-role="header" data-theme="b">
<h2>新闻内容</h2>
</div>
<div>
<div>
<asp:Image ID="newsImage" runat="server" AlternateText="新闻图片" />
</div>
<div>
<asp:Label ID="lblDetail" runat="server" Text="Label"></asp:Label>
</div>
</div>
<div data-role="footer" data-theme="d">
<h4>餐饮咨询</h4>
</div>
</div>
</form>
</body>
其实原因特别简单，就是显示的内容没有放在content里边，所以在div里加一个data-role="content"就可以了，修改后的代码如下：
复制代码 代码如下:
<body>
<form id="form1" runat="server">
<div data-role="page" id="page">
<div data-role="header" data-theme="b">
<h2>新闻内容</h2>
</div>
<div>
<div>
<asp:Image ID="newsImage" runat="server" AlternateText="新闻图片" />
</div>
<div>
<asp:Label ID="lblDetail" runat="server" Text="Label"></asp:Label>
</div>
</div>
<div data-role="footer" data-theme="d">
<h4>餐饮咨询</h4>
</div>
</div>
</form>
</body>
您可能感兴趣的文章：
解决JQeury显示内容没有边距内容紧挨着浏览器边线
css3中flexbox伸缩盒深入理解
css中负Margin你不知道的秘密
CSS浮动属性Float入门教程
jQuery中的bind绑定事件与文本框改变事件的临时解决方法
css margin属性兼容性分析
CSS浏览器兼容性问题及解决方案
CSS语法手册四文本填充，边框，边界和位置属性二
css padding在ie7、ie6、firefox中的兼容问题
CSS中Margin和Padding的用法与区别
[关闭]