How to Add Line Breaks to the Bottom of a Webpage
The HTML line break character allows web designers to separate lines on a web page. This character is useful for creating a blank line between HTML elements such as text or images. You can also use the line feed character to append extra white space to the bottom of your web page. Instead of adding line feed characters to your HTML code, you can use JavaScript to insert them automatically.
Other People Are Reading
Instructions
-
-
1
Launch Notepad, and open one of your HTML documents.
-
2
Add this HTML code to the "<body>" section of the document:
<input id="Button1" type="button" value="button" onclick="return AddLineBreaks()" />
This creates a button that calls a JavaScript function named "AddLineBreaks" when clicked.
-
-
3
Add the following JavaScript code to the "<head>" section of the document:
<script language="javascript" type="text/javascript">
var lineBreaksToAdd = 9;
function AddLineBreaks() {
var spanBreak;
var body = document.getElementsByTagName("body")[0];
for (var i=0; i < lineBreaksToAdd; i++)
{
{
spanBreak = document.createElement("span");
spanBreak.innerHTML = "<br />test";
body.appendChild(spanBreak);
}
}
</script>
The first line defines a variable named "linBreaksToAdd." It determines how many line breaks to add to the end of the Web page. The value of "lineBreaksToAdd" is nine in this example. Change that value to anything you like. The "AddLineBreaks" function creates HTML objects that contain the line break character. The function adds as many of these objects as specified in the variable "lineBreaksToAdd."
-
4
Save the HTML document and open it in your browser. Click the "Add Line Breaks" button. The JavaScript code will run and add line breaks to the end of the page.
-
1
Tips & Warnings
Experiment with the number of line breaks that you add to the bottom of your Web pages. If you add too many, you'll create wasted space at the bottom of the page.
