Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/image/5.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
如何在HTML中调整大小_Html_Image_Resize - Fatal编程技术网

如何在HTML中调整大小

如何在HTML中调整大小,html,image,resize,Html,Image,Resize,我有一个问题,我的网站又名一个模组,我想做一个游戏。当我粘贴图像时,我希望能够将其大小重新调整到整个屏幕的最大值示例:问题是我不希望出现空白,因此这里有一个示例,它应该是什么样子(不同的图像):山体背景已满 下面是我添加图像的代码: <img src="http://oi58.tinypic.com/2wmou89.jpg" style="max-width:100%; max-height:100%;" alt=""> 要解决此问题,请添加以下CSS规则: html, body

我有一个问题,我的网站又名一个模组,我想做一个游戏。当我粘贴图像时,我希望能够将其大小重新调整到整个屏幕的最大值示例:问题是我不希望出现空白,因此这里有一个示例,它应该是什么样子(不同的图像):山体背景已满

下面是我添加图像的代码:

<img src="http://oi58.tinypic.com/2wmou89.jpg" style="max-width:100%; max-height:100%;" alt="">

要解决此问题,请添加以下CSS规则:

html, body {
    margin: 0;
    padding: 0;
    min-height: 100%;
}
默认情况下,页面有一个愚蠢的上边距,因此这会导致空白,而此CSS代码将重置它

以下是我所做的:

<html>
  <head>
 <title>NostalgiaRP LS</title>
 <style>
 html, body {
    margin: 0;
    padding: 0;
    min-height: 100%;
}
 </style>
  </head>
  <body>

    <script type="text/javascript">
    <!--Put keywords in here to display when loading.-->
      keywords =
      [
       "Hacking Razley.",
       "Getting your credit card information.",
       "ED is coding your stuff!",  
       "Downloading a bunch of crap.",
       "Demoting admins.",
       "Fixing server bugs.",
       "Braking the game.",
       "Banning minges.",
       "Drawing ponies!:D.",
       "Checking your Steam ID.",
       "Removing System 32.",
       "Rehashing the MD5 algorithm.",
       "Bathing Father Grigori.",
       "Decrypting your steam account password.",
       "Re installing Garry's Mod.",
       "Killing Alyx.",
       "Reloading guns.",
       "Enter a useless message here!",
       "Asking for you to become an admin.",
       "Eating Watermelons.",
       "RDM.",
       "Fixing Source Engine.",
       "Drawing on walls.",
       "Taming Physics.",
       "Drinking Vodka...",
       "Sleeping.",
       "Fixing Gman's suit.",
       "Watching stuff and things...",
       "Reducing your lifespan.",
       "Joining the server.",
       "Delaying Episode 3.",
       "Uploading virus.",
       "......"
      ]


      var bCanChangeStatus = true;
      function ChangeText ( )  {
        if ( bCanChangeStatus )
        {
          var keyword = keywords[ Math.floor( Math.random() * keywords.length ) ]
          document.getElementById( "loadingtext" ).innerHTML = keyword;
        }

        setTimeout( "ChangeText()", 2500 );
      }

      ChangeText();

      var iFilesNeeded = 0;
      var iFilesTotal = 0;
      var bDownloadingFile = false;

      function SetFilesNeeded( iNeeded )
      {
        iFilesNeeded = iNeeded;
        RefreshFileBox();
      }

      function SetFilesTotal( iTotal )
      {
        iFilesTotal = iTotal;
        RefreshFileBox();
      }

      function DownloadingFile( filename )
      {
        if ( bDownloadingFile )
        {
          iFilesNeeded = iFilesNeeded - 1;
          RefreshFileBox();
        }

        document.getElementById( "loadingtext" ).innerHTML = "Downloading " + filename;
        bCanChangeStatus = false;
        setTimeout( "bCanChangeStatus = true;", 1000 );

        bDownloadingFile = true;

      }

      function SetStatusChanged( status )
      {
        if ( bDownloadingFile )
        {
          iFilesNeeded = iFilesNeeded - 1;
          bDownloadingFile = false;
          RefreshFileBox();
        }

        document.getElementById( "loadingtext" ).innerHTML = status;
        bCanChangeStatus = false;
        setTimeout( "bCanChangeStatus = true;", 1000 );
      }

      function RefreshFileBox()
      {
        document.getElementById( "files" ).innerHTML = "<img src='/images/loadingscreen/download.png' style='position: relative; top: 7px;'> " + iFilesNeeded + " downloads remaining";

        if ( iFilesTotal > 0 )
          document.getElementById( "files" ).style.visibility = 'visible';
        else
          document.getElementById( "files" ).style.visibility = 'hidden';
      }

      RefreshFileBox();

    </script>
        <iframe width="0%" height="0" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/16687438&amp;auto_play=true&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>

      <center>
      <div style="position: absolute;">
      <!-- Put the image URL here!!-->
    <img src="http://oi58.tinypic.com/2wmou89.jpg" style="height: 100%; max-width:100%; max-height:100%;" alt="">
    <div id="loadingtext" style="position:absolute; top:50%; left:50%; color: #666; font-family: Arial; font-size: 12px; margin-top:-6px; width:128px; margin-left:-64px; font-weight: bold;">Loading Text..</div>
</div>

        </div>
      </center>

      <div style='-webkit-box-reflect: below -120px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.1, transparent), to(rgba(255, 255, 255, 1.0))); position: absolute; top: 90%; right: 0; bottom: 0; left: 5%; height: 100px; overflow: show; font-family: Arial; font-size: 24px; font-weight: bold; color: #888' id='files'>
      </div>

    </div>

  </body>
</html>

怀旧
html,正文{
保证金:0;
填充:0;
最小高度:100%;
}
关键词=
[
“黑客拉兹利。”,
“获取您的信用卡信息。”,
“ED正在给你的东西编码!”,
“下载一堆废话。”,
“降级管理员。”,
“修复服务器错误。”,
“停止比赛。”,
“禁止明治。”,
“画小马!:D.”,
“检查你的蒸汽ID。”,
“拆卸系统32。”,
“重新对MD5算法进行灰化。”,
“给格里戈里神父洗澡。”,
“解密您的steam帐户密码。”,
“重新安装加里的国防部。”,
“杀死Alyx。”,
“重新装弹枪。”,
“在此处输入一条无用的消息!”,
“要求你成为一名管理员。”,
“吃西瓜。”,
“RDM。”,
“正在修复源引擎。”,
“在墙上画画。”,
“驯服物理学”,
“喝伏特加……”,
“睡觉。”,
“修理格曼的西装。”,
“看东西……”,
“缩短你的寿命。”,
“加入服务器。”,
“推迟第三集。”,
“上传病毒。”,
"......"
]
var bCanChangeStatus=true;
函数ChangeText(){
if(bCanChangeStatus)
{
var keyword=keywords[Math.floor(Math.random()*keywords.length)]
document.getElementById(“loadingtext”).innerHTML=关键字;
}
setTimeout(“ChangeText()”,2500);
}
ChangeText();
var=0;
变量iFilesTotal=0;
var bDownloadingFile=false;
需要的函数集文件(iNeeded)
{
如果需要=不需要;
RefreshFileBox();
}
函数SetFilesTotal(iTotal)
{
iFilesTotal=iTotal;
RefreshFileBox();
}
函数下载文件(文件名)
{
如果(b下载文件)
{
IFilesRequired=IFilesRequired-1;
RefreshFileBox();
}
document.getElementById(“loadingtext”).innerHTML=“下载”+文件名;
bCanChangeStatus=false;
setTimeout(“bCanChangeStatus=true;”,1000);
bDownloadingFile=true;
}
功能设置状态更改(状态)
{
如果(b下载文件)
{
IFilesRequired=IFilesRequired-1;
bDownloadingFile=false;
RefreshFileBox();
}
document.getElementById(“loadingtext”).innerHTML=状态;
bCanChangeStatus=false;
setTimeout(“bCanChangeStatus=true;”,1000);
}
函数RefreshFileBox()
{
document.getElementById(“文件”).innerHTML=”“+IFilesRequired+“下载剩余”;
如果(IFileTotal>0)
document.getElementById(“文件”).style.visibility='visible';
其他的
document.getElementById(“文件”).style.visibility='hidden';
}
RefreshFileBox();
正在加载文本。。

我得到了一张适合整个屏幕的图像。

我有点困惑。为什么不直接使用背景图片:url(“img url”);然后背景尺寸:封面;在你想添加背景图像的元素上?

说到CSS,我是个坏家伙,我该把它放在哪里?下面是全部代码最简单的方法是在
之前添加:
您的CSS代码在这里
无法正常工作!还是一样!html,body{margin:0;padding:0;minheight:100%;}我编辑了我的答案,里面有你的全部代码。这对我来说很好。只是忘了为图像添加
height:100%
。总是很乐意提供帮助:)不只是使用
width
height
属性吗?