I do not take the styles correctly when including a jsp

Question

I do not take the styles correctly when including a jsp

Navigation

#1 by (0 votes)

1

I have a jsp, in which styles work for me, but when I add

<%@ include file="usuarios.jsp" %>

The page is untidy and I do not take the styles. How can I solve that? The result code is as follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <link type="text/css" rel="stylesheet" href="style.css">
    <title>Opci&oacuten Jefe</title>
  </head>
  <body>

  <p> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Usuarios</title> 

<style type="text/css">
* { padding: 0; margin: auto; text-align: left; font-family:Arial; font-size:10px; }
#cabecera { background-color: #fff; }  
h1 { font: bold 1.5em arial; padding: 0.5em; }
#navegador { background-color: #ffffff; padding: 5px; }
#navegador li { margin: 0px 5px; padding: 5px; 
           background-color: #fff; width: 12%;float: left;
           list-style-type: none; position: relative; }
#subseccion1
             { position: absolute; top: 100%; left: 0px;  
             background-color: #ffffff; font:normal 12px arial;  
              display: none;border: 1px solid #530D9A;
   border-collapse: collapse;padding: 0.2em }                
#navegador li:hover,#table2:hover { background-color: #ffffff;
font-family:Arial;color:#530D9A;vertical-align: top;
   }
#navegador li a:link, #navegador li a:visited { 
           color: #530D9A; text-decoration: none; }
#navegador li a:hover, #navegador li a:active { 
           color:#530D9A ; text-decoration: none; }
.borrar { clear: both; }    

}

</style>


<script type="text/javascript">
function ver(n) {
         document.getElementById("subseccion"+n).style.display="block"
         }
function ocultar(n) {
         document.getElementById("subseccion"+n).style.display="none"
         }
</script>
</head>
<body>
<div id="navegador">
  <ul>
    <li id="seccion1" onmouseover="ver(1)" onmouseout="ocultar(1)">
      <a href="#">jlhevia</a>
      <div id="subseccion1">
        <p>&nbsp;&nbsp;<form action="" method="get"><a href="index.jsp?Salir=si">Salir</a></form>&nbsp;&nbsp; 

          </p>
      </div>
    </li>

  </ul>
  <div class="borrar"></div>
</div>

</body>
</html>
</p>
  <p style="text-align: center;"><label for="ltickets" class="first-name"><b><font

            size="16">Tickets de trabajo</font></b></label></p>
    <p style="text-align: center;"></p>
    <p style="text-align: center;"><label for="lopcion" class="first-name">Seleccione
        una opci&oacuten:</label></p>
    <form name="opcion" action="" method="post">



      <table class="table1" width="100%">
        <tbody>
          <tr>
            <td style="text-align: right; width: 129.6px;"><input name="rbjefe"

                checked="checked" type="radio" value="1"><br>
            </td>
            <td style="width: 260.4px;">
              <dl>
                <dt><label for="leditar" class="first-name">Editar parte de
                    trabajo</label></dt>
              </dl>
            </td>
          </tr>
          <tr>
            <td style="text-align: right;"><input name="rbjefe" type="radio" value="2"><br>
            </td>
            <td>
              <dl>
                <dt><label for="llistar" class="first-name">Listar partes de
                    trabajo</label></dt>
              </dl>
            </td>
          </tr>
          <tr>
            <td style="text-align: right;"><input name="rbjefe" type="radio" value="3"><br>
            </td>
            <td>
              <dl>
                <dt><label for="laprobar" class="first-name">Aprobar parte de
                    trabajo</label></dt>
              </dl>
            </td>
          </tr>
        </tbody>
      </table>
      <table style="width: 398px; height: 48px;">
        <tbody>
          <tr>
            <td style="text-align: right;"><br>
              <button name="btnaceptar"> Aceptar</button>&nbsp;&nbsp; </td>
            <td><br>
              &nbsp;&nbsp;<button name="btncancelar">Cancelar</button><br>
            </td>
          </tr>
        </tbody>
      </table>
    </form>

  </body>
</html>

html css jsp

asked by gulez 13.06.2018 в 10:27

source

1 answer

Value of columns per row of excel java Send and receive messages in c and python (client and server)

score 0 · Accepted Answer

HTML is badly formed; you try to put a complete HTML page inside another HTML page. You repeat <!DOCTYPE> , <html> , <head> , <body> ....

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
 ...
</head>
<body>

<p> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Usuarios</title> 
...

If you want to use the JSP within a web page, you must generate only the HTML that can be embedded within the position in which it is inserted. For example, no:

<%@page import="java.sql.*, javax.swing.*,javax.swing.JOptionPane,partes.*" language="java"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <link type="text/css" rel="stylesheet" href="style.css">
    <title>Usuarios</title>
  </head>
  <body>
    <h1>HOLA MUNDO</h1>
  </body>
</html>

otherwise

<%@page import="java.sql.*, javax.swing.*,javax.swing.JOptionPane,partes.*" language="java"%>
    <h1>HOLA MUNDO</h1>

This only generates an HTML <h1>HOLA MUNDO</h1> that does not break the rest of the HTML page