title: How to display background image in servlet
body: <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5"&gt;
    &lt;display-name&gt;ServletApplication&lt;/display-name&gt;
    &lt;welcome-file-list&gt;
      &lt;welcome-file&gt;index.html&lt;/welcome-file&gt;
      &lt;welcome-file&gt;index.htm&lt;/welcome-file&gt;
      &lt;welcome-file&gt;index.jsp&lt;/welcome-file&gt;
      &lt;welcome-file&gt;default.html&lt;/welcome-file&gt;
      &lt;welcome-file&gt;default.htm&lt;/welcome-file&gt;
      &lt;welcome-file&gt;default.jsp&lt;/welcome-file&gt;
    &lt;/welcome-file-list&gt;
    &lt;servlet&gt;
      &lt;description&gt;&lt;/description&gt;
      &lt;display-name&gt;DemoServlet&lt;/display-name&gt;
      &lt;servlet-name&gt;DemoServlet&lt;/servlet-name&gt;
      &lt;servlet-class&gt;com.mayu.servlet.DemoServlet&lt;/servlet-class&gt;
    &lt;/servlet&gt;
    &lt;servlet-mapping&gt;
      &lt;servlet-name&gt;DemoServlet&lt;/servlet-name&gt;
      &lt;url-pattern&gt;/DemoServlet&lt;/url-pattern&gt;
    &lt;/servlet-mapping&gt;
    &lt;servlet&gt;
      &lt;description&gt;&lt;/description&gt;
      &lt;display-name&gt;Login&lt;/display-name&gt;
      &lt;servlet-name&gt;Login&lt;/servlet-name&gt;
      &lt;servlet-class&gt;com.mayu.servlet.Login&lt;/servlet-class&gt;
    &lt;/servlet&gt;
    &lt;servlet-mapping&gt;
      &lt;servlet-name&gt;Login&lt;/servlet-name&gt;
      &lt;url-pattern&gt;/Login&lt;/url-pattern&gt;
    &lt;/servlet-mapping&gt;
    &lt;servlet&gt;
      &lt;description&gt;&lt;/description&gt;
      &lt;display-name&gt;RoomMaster&lt;/display-name&gt;
      &lt;servlet-name&gt;RoomMaster&lt;/servlet-name&gt;
      &lt;servlet-class&gt;com.mayu.servlet.RoomMaster&lt;/servlet-class&gt;
    &lt;/servlet&gt;
    &lt;servlet-mapping&gt;
      &lt;servlet-name&gt;RoomMaster&lt;/servlet-name&gt;
      &lt;url-pattern&gt;/RoomMaster&lt;/url-pattern&gt;
    &lt;/servlet-mapping&gt;
  &lt;/web-app&gt;</code></pre>
  </div>
  </div>
  
  above you see my Web-xml</p>
  
  <p>this is output i need, but when integreted with servlet i get only login without image<a href="https://i.stack.imgur.com/b7e3e.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/b7e3e.png" alt=" and this is output without servlet "></a>
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code> .hr {
              background: url("../img/login.jpg");
          }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;Reservation&lt;/title&gt;
      &lt;!-- Include CSS File Here --&gt;
      &lt;link rel="stylesheet" href="css/style.css" /&gt;
      &lt;link rel="stylesheet" href="css/Site.css" /&gt;
      &lt;link rel="stylesheet" href="css/bootstrap.css" /&gt;
      &lt;link rel="stylesheet" href="css/bootstrap.min.css" /&gt;
      &lt;!-- Include JS File Here --&gt;
      &lt;!--&lt;script src="js/login.js"&gt;&lt;/script&gt;--&gt;
      &lt;script src="js/jquery-1.9.0.1.min.js"&gt;&lt;/script&gt;
      &lt;script src="js/bootstrap.js"&gt;&lt;/script&gt;
      
  &lt;/head&gt;
  &lt;body class="hr"&gt;
      &lt;form id="myform" method="post" action="RoomType.html" name="myform"&gt;
          &lt;div class="row"&gt;
              &lt;div class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-2"&gt;
                  &lt;div class="jumbotron"&gt;
                      &lt;form class="form-horizontal" style="margin-top:50px; margin-bottom:50px;"&gt;
                          &lt;div class="form-group"&gt;
                              &lt;label for="inputEmail3" class="col md-2 col-sm-2 col-md-offset-2 control-label" style="padding:0px;"&gt;User Id&lt;/label&gt;
                              &lt;div class="col-md-6 col-sm-6 col-xs-12"&gt;
                                  &lt;input type="text" name="username" id="username" /&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div class="form-group"&gt;
                              &lt;label for="inputPassword3" class="col-md-2 col-sm-2 col-md-offset-2 control-label" style="padding:0px;"&gt;Password&lt;/label&gt;
                              &lt;div class="col-md-6 col-sm-6 col-xs-12"&gt;
                                  &lt;input type="password" name="password" id="password" /&gt;
  
                              &lt;/div&gt;
                          &lt;/div&gt;
  
                          &lt;div class="form-group"&gt;
                              &lt;div class="col-sm-offset-4 col-sm-3"&gt;
                                  &lt;!--&lt;input type="button" value="Login" id="submit" onclick="myFunction()"/&gt;--&gt;
                                  &lt;input type="button" onclick="myFunction()" value="Login"&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
  
  
                      &lt;/form&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/form&gt;
      &lt;script&gt;
          function myFunction() {
              document.getElementById("myform").submit();
          }
  
          $(document).ready(function () {
              $('.combobox').combobox();
              //$('.combobox').combobox({newOptionsAllowed: false});
              $('form').submit(function (e) {
                  e.preventDefault();
                  alert($('input[name="normal"]').val());
                  alert($('input[name="horizontal"]').val());
                  alert($('input[name="inline"]').val());
              });
          })
  
          //document.getElementById("TextBox1").value = Date()
      &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I am doing a web base project working on <code>servlet</code>, in that I created <code>servlet page</code> and added my <code>css</code>,<code>js</code>,<code>img folder</code> to the <code>WebContent folder</code>. My problem is I set a <code>image</code> to the body background that image can't seen on browser. i added my login page code please see and help me to solve this.</p>