编程 Javascript

解决JQeury显示内容没有边距内容紧挨着浏览器边线

Posted in Javascript onDecember 20, 2013

写的JQuery页面显示的内容没有边距，内容紧挨着浏览器边线，特别难看（如下图）
解决JQeury显示内容没有边距内容紧挨着浏览器边线
代码如下：

<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显示内容没有边距内容紧挨着浏览器边线

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JavaScript 一行代码,轻松搞定浮动快捷留言-V2升级版

Apr 02 Javascript

javascript attachEvent绑定多个事件执行顺序问题

Oct 20 Javascript

js TextArea的选中区域处理

Dec 28 Javascript

js中创建对象的几种方式示例介绍

Jan 26 Javascript

动态加载jQuery的两种方法实例分析

Jul 17 Javascript

js微信扫描二维码登录网站技术原理

Dec 01 Javascript

bootstrap模态框消失问题的解决方法

Dec 02 Javascript

angular动态删除ng-repaeat添加的dom节点的方法

Jul 20 Javascript

轻松理解vue的双向数据绑定问题

Oct 30 Javascript

Vue.set()实现数据动态响应的方法

Feb 07 Javascript

vue通过指令(directives)实现点击空白处收起下拉框

Dec 06 Javascript

vue-cli3 引入 font-awesome的操作

Aug 11 Javascript

JS比较两个时间大小的简单示例代码

Dec 20 #Javascript

javascript获取URL参数与参数值的示例代码

Dec 20 #Javascript

javascript获取鼠标点击元素对象(示例代码)

Dec 20 #Javascript

js 操作select与option(示例讲解)

Dec 20 #Javascript

js插件方式打开pdf文件(浏览器pdf插件分享)

Dec 20 #Javascript

JS动态添加与删除select中的Option对象(示例代码)

Dec 20 #Javascript

js select option对象小结

Dec 20 #Javascript

You might like

PHP SEO优化之URL优化方法

2011/04/21 PHP

浅析echo(),print(),print_r(),return之间的区别

2013/11/27 PHP

php判断两个日期之间相差多少个月份的方法

2015/06/18 PHP

解决PHP里大量数据循环时内存耗尽的方法

2015/10/10 PHP

Laravel 5.5基于内置的Auth模块实现前后台登陆详解

2017/12/21 PHP

js getBoundingClientRect() 来获取页面元素的位置

2010/11/25 Javascript

使用JavaScript动态设置样式实现代码及演示动画

2013/01/25 Javascript

JS代码同步文本框内容的实例方法

2013/07/12 Javascript

JQuery处理json与ajax返回JSON实例代码

2014/01/03 Javascript

jQuery EasyUI编辑DataGrid用combobox实现多级联动

2016/08/29 Javascript

Vue2.0组件间数据传递示例

2017/03/07 Javascript

js,jq,css多方面实现简易下拉菜单功能

2017/05/13 Javascript

你可能不知道的JSON.stringify()详解

2017/08/17 Javascript

vue实现前进刷新后退不刷新效果

2018/01/26 Javascript

详解Chai.js断言库API中文文档

2018/01/31 Javascript

微信小程序实现星级评分和展示

2018/07/05 Javascript

vue完成项目后,打包成静态文件的方法

2018/09/03 Javascript

详解小程序云开发数据库

2019/05/20 Javascript

JS array数组检测方式解析

2020/05/19 Javascript

基于ajax及jQuery实现局部刷新过程解析

2020/09/12 jQuery

json跨域调用python的方法详解

2017/01/11 Python

通过源码分析Python中的切片赋值

2017/05/08 Python

python做量化投资系列之比特币初始配置

2018/01/23 Python

python实现数据导出到excel的示例--普通格式

2018/05/03 Python

Python安装pycurl失败的解决方法

2018/10/15 Python

解决Jupyter因卸载重装导致的问题修复

2020/04/10 Python

使用Python三角函数公式计算三角形的夹角案例

2020/04/15 Python

pytorch中 gpu与gpu、gpu与cpu 在load时相互转化操作

2020/05/25 Python

Python轻量级web框架bottle使用方法解析

2020/06/13 Python

HTML5制作3D爱心动画教程献给女友浪漫的礼物

2014/11/05 HTML / CSS

香港永安旅游网：Wing On Travel

2017/04/10 全球购物

Shoes For Crews法国官网：美国领先的防滑鞋设计和制造商

2018/01/01 全球购物

比较基础的php面试题及答案-编程题

2012/10/14 面试题

司机辞职报告范文

2014/01/20 职场文书

债务纠纷委托书范本

2014/10/14 职场文书

师德承诺书2015

2015/04/28 职场文书