简体   繁体   中英

line breaks and indentation in html output

Recently I was printing out some HTML source for a project I've been working on. I like to keep my markup tidy and readable. I noticed that in some places there are no line breaks on the outputted html and in some places there is excess indentation. For example take the following code, where I have preserved the indentation from the source file:

    <div id="sections">
    <ul>
    <?php if(!empty($details)) { ?>
        <li><a href="#details"><span>Details</span></a></li>

    <?php } if(!empty($address) { ?>
        <li><a href="#viewmap"><span>Location Map</span></a></li>

    <?php } if(!empty($reviews) { ?>
        <li><a href="#reviews"><span>Reviews (<?php echo $numrows; ?>)</span></a></li>

    <?php } if($email != null) { ?>
        <li><a href="#sendemail"><span>Send an Email</span></a></li>
    <?php } ?>
    </ul>

The generated HTML output is as follows:

    <div id="sections">
    <ul>
                <li><a href="#details"><span>Details</span></a></li>

                <li><a href="#viewmap"><span>Location Map</span></a></li>

                <li><a href="#sendemail"><span>Send an Email</span></a></li>
            </ul>
    </div>

Here we can see the DIV and UL tags have two tab indents from the left - this is fine. However the LI tags have 5 indents from the left - it should only be 3 if it goes according to my code. The end UL tag also has two extra indents.

Is this just the expected behaviour or can this be rectified somehow?

IF youre worried about indentation you can move you php tags to teh very beginning of their lines, then when they collapse there wont be extra indentation thats added tot he next line. That ofcourse makes your source much harder to read. And that is much more important than reading the rendered html IMO.

Problem is you've indented the entire block. Space is coming from before <?php ?> on each line

Everything's that outside the <?php...?> tags remains untouched by the PHP interpreter. The only exception is a trailing line feed that intermediately follows a closing tag, as documented .

You are probably mixing tabs and spaces. If you are using a decent editor, there should be a feature to make them visible.

Well, the line breaks are right in your code. Everything except the line break immediately after ?> gets put out :

[…] when PHP hits the ?> closing tags, it simply starts outputting whatever it finds (except for an immediately following newline - see instruction separation ) until it hits another opening tag.

So just looking at this example:

<?php if(!empty($details)) { ?>
    <li><a href="#details"><span>Details</span></a></li>

<?php }

Everything except the line break immediately after the ?> gets put out, including the line break before the following <?php , so:

    <li><a href="#details"><span>Details</span></a></li>
‍

So? The output is matching your code perfectly. I don't get, why there would be a problem?

*tab**tab*<div id="sections">*newline*
*tab**tab*<ul>*newline*
*tab**tab*<?php if(!empty($details)) { ?>
*tab**tab**tab*<li><a href="#details"><span>Details</span></a></li>*newline*
*newline*
*tab**tab*<?php } if(!empty($address) { ?>
*tab**tab**tab*<li><a href="#viewmap"><span>Location Map</span></a></li>*newline*
*newline*
*tab**tab*<?php } if(!empty($reviews) { ?>
*tab**tab**tab*<li><a href="#reviews"><span>Reviews (<?php echo $numrows; ?>)</span></a></li>*newline*
*newline*
*tab**tab*<?php } if($email != null) { ?>
*tab**tab**tab*<li><a href="#sendemail"><span>Send an Email</span></a></li>*newline*
*tab**tab*<?php } ?>
*tab**tab*</ul>

Delete the php code and you see that the numbers of tabs and newlines match.

Oh and btw: The first ul should have a tab more, because it's inside the div.

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.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM