如何将网站标题图片宽度设置为填充100％的浏览器或屏幕..？ [英] How to set website header image width as fill the 100% of browser or screen..?
本文介绍了如何将网站标题图片宽度设置为填充100％的浏览器或屏幕..？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在开发一个网站。我想将标题图像宽度设置为屏幕的100％。
当我设置
i am developing a website. i want to set header imge width to 100% of screen.
when i am setting
<img src="image.jpg" width=100%>工作，但是用户单击restore_down按钮标题图像正在缩小，但我需要将图像宽度设置为sreen width。
因为所有客户都没有相同的分辨率。
提前数百万的谢谢.....
working, but user clicks restore_down button the header image is shrinking, but i need to set the image width as sreen width.
Because all the clients don't have same resolution.
Millions of thanks in advance.....
推荐答案
把你的标题图片作为div或table的背景，td
1.如果你的图片适合重复-x属性，然后很容易修复宽度：100％;适用于所有分辨率的电脑，笔记本电脑（包括最小高度，最大宽度笔记本电脑屏幕）以及所有设备，如ipad，ipod，iphone等
这是你的css，如果图像遇到重复x
背景：url（----）repeat-x left top;
否则选项2
2.如果你的图像不适合repeat-x，你必须使用javascript（j-query）脚本使图像适合所有浏览器，操作系统和设备。
必须像这样修复和jquery将发挥浏览器窗口宽度的作用，并添加相应的宽度属性添加到图像.......
put your header image as a background for a div or table , td
1. if your image suit for repeat-x property , then it is easy to fix width:100%; for all resolution pc , laptop (including-min height,max width laptop screen) and all device like ipad,ipod,iphone ,etc
This is ur css if image meets repeat x
background:url(----) repeat-x left top;
otherwise option 2
2. if ur image not suit repeat-x , u have to use javascript(j-query) script to make image fit in all browser,os and device.
have to fix like this and jquery is going to play role of finding browser window width and adding corresponding width attribute is added to the image.......
< img src =---->< / img>
<img src="----"></img>
我有代码，如果你想回复我.......
I have code if u want reply me.......
< / head>
< body>
< html>
< div id =main>
< div class =contentarea>
< div class =imagearea>
< div align =center></ *图像位置* /width = 100％height =360px>< / div>
< / div>
< / div>
< / div>
< / body>
< / html>
< style>
</head>
<body>
<html>
<div id="main">
<div class="contentarea">
<div class="imagearea">
<div align="center"><"/*image location*/" width=100% height="360px"></div>
</div>
</div>
</div>
</body>
</html>
<style>
/* CSS Document */
body{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
margin:0 auto}
#main{
width:100%;
height:2000px;
background-color: #FFFFCC;
}
#contentarea{
margin:0 auto;
width:1000px;
height:2000px;
}
.imagearea {
max-width: 100%;
margin:0px auto;
}
< / style>
</style>
< html>
< head> ;
< script type =text / javascriptsrc =http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js>< / script>
< script type =text / javascript>
var contWidth = 120;
var contHeight = 83;
var bgOrigWidth = 1280;
var bgOrigHeight = 632;
<html>
<head>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
var contWidth=120;
var contHeight=83;
var bgOrigWidth=1280;
var bgOrigHeight=632;
这篇关于如何将网站标题图片宽度设置为填充100％的浏览器或屏幕..？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
