Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
This course introduces web designers to the nuts and bolts of HTML (HyperText Markup Language), the programming language used to create web pages. Author Bill Weinman explains what HTML is, how it's structured, and presents the major tags and features of the language. Discover how to format text and lists, add images and flow text around them, link to other pages and sites, embed audio and video, and create HTML forms. Additional tutorials cover the new elements in HTML5, the latest version of HTML, and prepare you to start working with Cascading Style Sheets (CSS).
In HTML, paragraphs are typically used to display text. Let's go ahead and make a working copy of paragraph.html and I'll rename this to paragraph-working.html and I am going to open it in my text editor. And I am going to go ahead and also open it in my browser. I'm using Firefox here. And I'm just going to move the browser over to the right side of the screen and drag the editor over here a little bit, so we can see both of these things at the same time.
I am going to go up here and I am going to turn on Soft Wrapping in my editor so that you can see this. So here we can see we have a couple of paragraphs down here and one of them is a little longer than the other one. And paragraphs are created with the p element. So you notice there is a begin tag and an end tag and the element is named p, just one letter p. And over here in the browser that's displaying as two separate paragraphs, one of them is there and one of them is there. And paragraphs are typically displayed with some blank space between them, of course that can all be modified using CSS.
The content of a paragraph is typically text, but it may also contain any inline content, for example, I could take the word formatted here and I could make it into a link. I am just going to put it on a separate line. I am going to type a href= and just an empty link at this point and close the a tag at the end there, and I am going to save that and come over here into the browser and reload it, and you see we get a little link there. And so that a element is considered inline content and so it's allowed inside a paragraph.
We'll discuss inline versus block content later in this chapter, but for now just understand that inline content is typically what goes in a paragraph. It's also possible to put text outside of a paragraph, so I can just come up here and I can say this is a paragraph of text. And many browsers will treat that very similar to an actual paragraph. This is not recommended. It's much easier to format text when it's within the paragraph element or another block element. I am going to go ahead and delete that and save it.
In previous versions of HTML, it was common to format paragraphs using
attributes on the tag.
tag.For example, I could say align="right" like that, and if I save that and reload it in the browser, you'll notice that this paragraph is now right-aligned and it's ragged on the left. And if I do this with the other paragraph instead you can see it a little bit easier because that one is a longer paragraph. So you can see we have that ragged left there and now this paragraph is ragged right because I took that out.
Now formatting paragraphs this way still works, of course because browsers are designed to accept legacy HTML, but it's not recommended and it's actually considered obsolete with the latest version of HTML. The better way to do this is with CSS. I am just going to show you this right now even though we'll cover CSS in a little more detail later on. If I say style= and I can say "text-align: right" like that, and if I save that and come over here to the browser and reload, see nothing changes.
It's still right-aligned. So CSS is a former, flexible, and consistent way to do this and we'll cover some basic CSS later in the course, or you can see my CSS for Developers course for more detail about CSS. So paragraphs are created with the p element. Using the p element, it's easy to create paragraphs and to format them using CSS.
Find answers to the most frequently asked questions about HTML Essential Training.
Here are the FAQs that matched your search "":
Sorry, there are no matches for your search ""—to search again, type in another word or phrase and click search.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.