How to display background image in servlet -


<?xml version="1.0" encoding="utf-8"?>  <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">    <display-name>servletapplication</display-name>    <welcome-file-list>      <welcome-file>index.html</welcome-file>      <welcome-file>index.htm</welcome-file>      <welcome-file>index.jsp</welcome-file>      <welcome-file>default.html</welcome-file>      <welcome-file>default.htm</welcome-file>      <welcome-file>default.jsp</welcome-file>    </welcome-file-list>    <servlet>      <description></description>      <display-name>demoservlet</display-name>      <servlet-name>demoservlet</servlet-name>      <servlet-class>com.mayu.servlet.demoservlet</servlet-class>    </servlet>    <servlet-mapping>      <servlet-name>demoservlet</servlet-name>      <url-pattern>/demoservlet</url-pattern>    </servlet-mapping>    <servlet>      <description></description>      <display-name>login</display-name>      <servlet-name>login</servlet-name>      <servlet-class>com.mayu.servlet.login</servlet-class>    </servlet>    <servlet-mapping>      <servlet-name>login</servlet-name>      <url-pattern>/login</url-pattern>    </servlet-mapping>    <servlet>      <description></description>      <display-name>roommaster</display-name>      <servlet-name>roommaster</servlet-name>      <servlet-class>com.mayu.servlet.roommaster</servlet-class>    </servlet>    <servlet-mapping>      <servlet-name>roommaster</servlet-name>      <url-pattern>/roommaster</url-pattern>    </servlet-mapping>  </web-app>
above see web-xml

this output need, when integreted servlet login without image , output without servlet

 .hr {              background: url("../img/login.jpg");          }
<html>  <head>      <title>reservation</title>      <!-- include css file here -->      <link rel="stylesheet" href="css/style.css" />      <link rel="stylesheet" href="css/site.css" />      <link rel="stylesheet" href="css/bootstrap.css" />      <link rel="stylesheet" href="css/bootstrap.min.css" />      <!-- include js file here -->      <!--<script src="js/login.js"></script>-->      <script src="js/jquery-1.9.0.1.min.js"></script>      <script src="js/bootstrap.js"></script>        </head>  <body class="hr">      <form id="myform" method="post" action="roomtype.html" name="myform">          <div class="row">              <div class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-2">                  <div class="jumbotron">                      <form class="form-horizontal" style="margin-top:50px; margin-bottom:50px;">                          <div class="form-group">                              <label for="inputemail3" class="col md-2 col-sm-2 col-md-offset-2 control-label" style="padding:0px;">user id</label>                              <div class="col-md-6 col-sm-6 col-xs-12">                                  <input type="text" name="username" id="username" />                              </div>                          </div>                          <div class="form-group">                              <label for="inputpassword3" class="col-md-2 col-sm-2 col-md-offset-2 control-label" style="padding:0px;">password</label>                              <div class="col-md-6 col-sm-6 col-xs-12">                                  <input type="password" name="password" id="password" />                                </div>                          </div>                            <div class="form-group">                              <div class="col-sm-offset-4 col-sm-3">                                  <!--<input type="button" value="login" id="submit" onclick="myfunction()"/>-->                                  <input type="button" onclick="myfunction()" value="login">                              </div>                          </div>                          </form>                  </div>              </div>          </div>      </form>      <script>          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()      </script>  </body>  </html>

i doing web base project working on servlet, in created servlet page , added css,js,img folder webcontent folder. problem set image body background image can't seen on browser. added login page code please see , me solve this.

try making following change:

.hr {         background-image: url("/img/login.jpg");     } 

Comments

Popular posts from this blog

scala - 'wrong top statement declaration' when using slick in IntelliJ -

c# - DevExpress.Wpf.Grid.InfiniteGridSizeException was unhandled -

PySide and Qt Properties: Connecting signals from Python to QML -