Final Output Messed up Some Basic PHP
Question
I have the Following test document:
<!DOCTYPE html>
<html>
<head>
<title>A Word finding Tutorial
</title>
</head>
<body>
<?php
include "inc/header.php";
?>
<form action="test3.php" method="GET">
Text Field: <br> <textarea name="long_text" rows="4" cols="50">Enter the Para Here.</textarea>
<br>
Finding : <br> <input type="text" name="find" value="Enter the word to find">
<input type="submit" value="Submit">
Result:
</body>
</html>
Now the header.php file is Somewhat like This:-
<html>
<head>
<style>
img#imgheader {margin:5px;padding:10px 5px;}
div#header {background-color:#ccff33;}
</style>
</head>
<body>
<div id="header" style="text-align: center;">
<img id="imgheader" src="\test\img\trial.png" alt="header" height="30px" width="60px">
</div>
</body>
</html>
Now My Problem is that it is basically messed up when it is Being outputed like I saw the Source code Of final Output of test.php is as Follows:-
<!DOCTYPE html>
<html>
<head>
<title>A Word finding Tutorial
</title>
</head>
<body>
<html>
<head>
<style>
img#imgheader {margin:5px;padding:10px 5px;}
div#header {background-color:#ccff33;}
</style>
</head>
<body>
<div id="header" style="text-align: center;">
<img id="imgheader" src="\test\img\trial.png" alt="header" height="30px" width="60px">
</div>
</body>
</html>
<form action="test3.php" method="GET">
Text Field: <br> <textarea name="long_text" rows="4" cols="50">Enter the Para Here.</textarea>
<br>
Finding : <br> <input type="text" name="find" value="Enter the word to find">
<input type="submit" value="Submit">
Result:
</body>
</html>
As You could see the final output has like an Html page inside an HTML page. So basically it does not optimized by w3 but it can produce errors in future. My question is is it right way to do so or not and if not how to write it so it does not get messed up finally.
2 answers
solution1
3 2014-11-01 08:35:15
It seems pretty clear that your included file should not contain those headers. I suggest you first create a css file
mystyle.css
#header {text-align: center;}
img#imgheader {margin:5px;padding:10px 5px;}
div#header {background-color:#ccff33;}
Then header.php should look something like (note your slashes will not work),
<link rel="stylesheet" type="text/css" href="mystyle.css" />
<div id="header">
<img id="imgheader" src="/test/img/trial.png" alt="header" height="30" width="60">
</div>
It currently includes the duplicated html tags because you included them in header.php .
solution2
0 ACCPTED 2014-11-01 08:40:11
This is not correct HTML. You must edit your header.php file to:
<?php
function returnHead() { ?>
<style>
img#imgheader {margin:5px;padding:10px 5px;}
div#header {background-color:#ccff33;}
</style>
<?php }
function returnBody() { ?>
<div id="header" style="text-align: center;">
<img id="imgheader" src="\test\img\trial.png" alt="header" height="30px" width="60px">
</div>
<?php }
?>
And then turn your test document to:
<?php
include "inc/header.php";
?>
<!DOCTYPE html>
<html>
<head>
<title>A Word finding Tutorial</title>
<?php returnHead(); ?>
</head>
<body>
<?php returnBody(); ?>
<form action="test3.php" method="GET">
Text Field: <br> <textarea name="long_text" rows="4" cols="50">Enter the Para Here.</textarea>
<br>
Finding : <br> <input type="text" name="find" value="Enter the word to find">
<input type="submit" value="Submit">
Result:
</body>
</html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.