Adding Text to Your Pages in Dreamweaver CC
- Adding Text
- Cutting, Copying, and Pasting Text
- Dragging and Dropping Text
- Using Paste Special
- Applying Headings
- Applying Character Formats
- Applying HTML Text Styles
- Using Preformatted Text
- Adding Line Breaks
- Indenting and Aligning Text with HTML
- Working with Lists
- Inserting Special Characters
- Working with Font Styles
- Using Web Fonts
- Adding Automatic Dates
- Finding and Replacing
- Finding Text with a Simple Search
- Performing Advanced Text Searches
- Finding and Replacing in Source Code
- Finding and Replacing with a Specific Tag
- Using Regular Expressions for Searching
- Checking Spelling
When you add text, you need to deal with two different aspects of the text: its structure and its presentation. Structural elements are things like paragraphs, headings, lists, and the like; presentation is how the text looks, including things like the font, font size, text color, and so on. Most sites these days separate the structure and the presentation. Structure is about organizing the content on the page, and presentation involves making the content look good.
In this chapter, we’ll concentrate on getting text onto your page and applying structure using headings and lists. We’ll also cover using basic HTML text styles to change the look of your text. Dreamweaver CC introduces integration with Adobe Edge Fonts, making web fonts easy to use, so we’ll show you how to add beautiful type to your pages.
Adding Text
Most of the text on a webpage is formatted in blocks, which are enclosed by beginning and ending HTML tags. For example, the HTML for a line of text with paragraph tags wrapped around it looks like this:
<p>This text is wrapped in beginning and ending paragraph tags.</p>
For a browser to understand that this is a paragraph, you (or in this case, Dreamweaver) have to make it one by adding the surrounding <p> tags.
Of course, in Dreamweaver’s Design view or Live view, you won’t see the HTML tags. All of the text contained between the opening <p> tag and the closing </p> tag is considered by a web browser to be within the same paragraph, no matter how much text is between the tags. The <p>...</p> combination is an example of a container tag. Virtually all of the structural formatting that you can apply with Dreamweaver is done with container tags.
When you add text to a page with Dreamweaver, the program automatically wraps the text with paragraph tags when you press the Enter (Return) key on your keyboard. You can see this if you switch to Code view by clicking the Code button at the top of the Dreamweaver editing window .
Dreamweaver also has special commands that help you import entire Microsoft Word or Excel documents as webpages. (See “Using Paste Special,” later in this chapter. Also, refer to Chapter 19, “Working with Other Applications.”)
To insert text
- In Dreamweaver’s Design view, click in the page where you want to add text.
- Type the text you want.