Join Bill Weinman for an in-depth discussion in this video Using paragraph tags, part of XHTML and HTML Essential Training.
- View Offline
- Exercise Files
Let's take a look at how XHTML and HTML handle paragraphs in a document. Here we have a document in our text editor, the top window is the text editor, the bottom window here is the browser and this document has a paragraph in it. It has two paragraphs actually. This paragraph here and let me scroll down so you can see the whole thing and this paragraph over here. Now you will notice that the paragraphs are enclosed in p tags. The p tag is for paragraph and the p tag is a container. So it has content.
The content of the container is the paragraph itself and it has a begin tag and it has an end tag and that's how a paragraph is formed in XHTML, head HTML. So this paragraph here is displayed in the browser there and this paragraph here is displayed in the browser here. You will notice that the browser makes a nice space between them and formats them as separate paragraphs. So in a nutshell, that's how paragraphs work. Another thing I would like to talk about is how we format the paragraphs in the text editor. You will notice that this paragraph here runs on and it goes way off the screen and sometimes you'll see documents where paragraphs will go on for many, many screens wide, and they work just fine.
That really doesn't have any impact on how it's displayed in the browser. But if you remember, when we add white space like for instance a line break right here, this doesn't really affect how the text is displayed in the browser. I will go ahead and I'll save this with the line break in it. You'll see it breaks after the word words and the comma there, so that would be right there and I'll reload it in the browser and you see that that does not affect how it's displayed in the browser. So what you can do is you can actually reformat this and I'll use a feature in my text editor, most text editors have a feature like this, like we call it a hard wrap or something like that.
In this one, it's called Split lines and it's in the Edit menu there. So I'll go ahead and I'll click on Split lines. It wraps the paragraph around, so that it all fits on the screen here in the Editor. I will go ahead and I'll save that and I'll reload it in the browser. So it has no effect on how it's displayed in the browser, but it makes it readable on the screen here in my text editor. This is something that's just nice to do. It makes it readable in the text editor and makes it a little bit more workable if you have to use it in another environment like in a console on a server or something like that or you just need to make a quick edit when you are some place else and it just makes it easier to work with and it doesn't have any effect on how it's displayed.
So I consider a nice practice, I always wrap my paragraphs so that they fit on the screen in my text editor and they go ahead and work just fine in the browser when I do that.
- Understanding the structure of an HTML or XHTML document
- Creating and using templates
- Controlling white space and line breaks
- Making effective use of tables and frames
- Flowing text around an image
- Formatting tables with CSS
- Creating web pages that work properly across platforms and devices
- Reviewing a case study of a complete web site
Skill Level Beginner
1. Introducing XHTML and HTML
2. Text Tags
3. Image Tags
Using inline images3m 17s
4. Link Tags
9. Creating a Simple Web Page from Scratch
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.