【转】超宽的banner条自适应浏览器大小始终居中的方法

简介: 现在越来越多的人使用宽屏的显示器了,所以传统的1024或者960的宽度banner条也逐渐的不被客户端访客所喜欢,所以现在在网站前端开发中一定要考虑到这一点,但是我们会发现在宽屏浏览器下设计出来的banner在传统的1024的显示器下浏览是会出现横向滚动横条。只要在对应标签插入如下CSS即可解决。 position: absolute;top: 0;left: 50%;margin

在越来越多的人使用宽屏的显示器了,所以传统的1024或者960的宽度banner条也逐渐的不被客户端访客所喜欢,所以现在在网站前端开发中一定要考虑到这一点,但是我们会发现在宽屏浏览器下设计出来的banner在传统的1024的显示器下浏览是会出现横向滚动横条。只要在对应标签插入如下CSS即可解决。

position: absolute;
top: 0;
left: 50%;
margin-left: -960px;//banner图大小的一半
width: 1920px;//图宽
height: 600px;//图高

 

 

目录
相关文章
|
8月前
|
JavaScript
一招教你实现自适应浏览器大小的Echarts饼状图
一招教你实现自适应浏览器大小的Echarts饼状图
174 0
页面自适应浏览器宽高
autodivheight(); function autodivheight() { //函数:获取尺寸 //获取浏览器窗口高度 var winHeight = 0; if (window.
1046 0
echarts宽高自适应及浏览器大小变化自动刷新
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/gisdoer/article/details/81868910 echarts宽高...
2059 0
|
C# 数据可视化 容器
WPF自适应可关闭的TabControl 类似浏览器的标签页
原文:WPF自适应可关闭的TabControl 类似浏览器的标签页 效果如图:   虽然说是自适应可关闭的TabControl,但TabControl并不需要改动,不如叫自适应可关闭的TabItem.
2023 0
easyui中datagrid自适应浏览器大小
因为datagrid的fitColumns只有在初次加载数据的时候生效,所以在加载完数据后再改变浏览器大小,datagrid是不会改变大小的,只能保持在加载数据的时候的浏览器大小 解决方法就...
1900 0
|
Web App开发 .NET
asp.net 调用echarts显示图表控件随浏览器自适应解决方案
1、问题来源         我们在asp.net开发中常使用到frameset的框架结构,比如上左中右方式,在中间部分是一个可以控制左侧部分显示隐藏的功能,这时右边内容区域如果有使用echa...
1129 0
|
前端开发 JavaScript
沫沫金;;最新Iframe全浏览器兼容自适应高度解决方案
核心:使用jQuery技术 宽度: $("#mainContent").css('width',$(window).width());  高度:onload="$(this).height($(this).
728 0
|
JavaScript UED
Silverlight——施工计划日报表(四)——自适应浏览器窗口
转自http://www.cnblogs.com/codelove/archive/2011/06/12/2079232.html 在很多情况下,从用户体验的角度考虑,我们都希望我们的Silverlight程序能够适应各种大小的浏览器窗口或者框架,如图所示:   那么如何使Silverlight程序能够自适应浏览器窗口的大小呢,即使在动态改变浏览器窗口的时候也不例外。
950 0
|
JavaScript UED
Silverlight——施工计划日报表(四)——自适应浏览器窗口
在很多情况下,从用户体验的角度考虑,我们都希望我们的Silverlight程序能够适应各种大小的浏览器窗口或者框架,如图所示:   那么如何使Silverlight程序能够自适应浏览器窗口的大小呢,即使在动态改变浏览器窗口的时候也不例外。
901 0