Headings are important structural elements in HTML.
#Text on image dreamweaver code
So in the previous step, you changed the formatting of the text from a paragraph element to a Heading 1 element, and the HTML code changed to this: A pair of opening and closing tags in HTML is called an element. The first is the opening tag for a paragraph, and the second is the closing tag for a paragraph. The text OrganicUtopia Events originally had an opening and closing tag defining it as a paragraph. Page content such as text is wrapped in opening and closing tags, and everything between these two tags is formatted according to the rules of these tags. Use the Format drop-down menu in the Property Inspector to make the selected text a level-1 heading.Īlthough you are working in Dreamweaver’s Design view, you have actually changed the HTML code for this page. By default, the style of any HTML text formatted as Heading 1 is generic: the color is black and the font-family is Times New Roman.
Choose Heading 1 from the Format drop-down menu. You will learn much more about the use of HTML and CSS in the next lesson however, you will need to have a basic understanding of these two languages in order to use the Property Inspector to format your text.Ħ Locate the Property Inspector at the bottom of your screen there are two buttons immediately below the word “Properties.” If necessary, click on the HTML button to see your HTML formatting options. HTML stands for Hypertext Markup Language, and CSS stands for Cascading Styles Sheets.
Located at the bottom of the screen, the Property Inspector allows you to format your text using a combination of HTML and CSS. You will now format your text using the Property Inspector. Typing the words OrganicUtopia Events and then putting them on their own line.ĥ Click and drag to highlight the phrase you just typed. Type OrganicUtopia Events and press Enter (Windows) or Return (Mac OS) to create a line break. First, you’ll add a headline to give the first paragraph some context.Ĥ Click to place your cursor in front of the word There’s in the first paragraph. Without any formatting, the text seems random and lacks purpose. If not, open it now.ģ Double-click on the events.html file in your Files panel to open it in the Design view. In this section, you’ll be adding a headline and formatting the text on the events.html page.ġ f it’s not already open, launch Dreamweaver CS6.Ģ Make sure your dw03lessons site is open in the Files panel. You should already have created a new site, using the dw03lessons folder as your root.
In this lesson, you’ll be working with a few pages within a site and adding some photos and text to a simple page for a fictional store. Go to Site > New Site, and name the site dw03lessons, or, for details on creating a site, refer to Lesson 2, “Setting Up a New Site.” Typography and images on the Webĭreamweaver CS6 offers some convenient features for placing images and formatting text. You can follow along using your own files if you haven’t purchased a copy of this book.īefore you begin, you need to create site settings that point to the dw03lessons folder. These files are included with the book when you purchase it, either on a DVD with the printed book, or downloadable with the digital book. You will work with several files from the Dreamweaver CS6 Digital Classroom. See “Resetting the Dreamweaver workspace” in the Starting Up section of this book.
Starting upīefore starting, make sure that your tools and panels are consistent by resetting your workspace.
#Text on image dreamweaver how to
In this Dreamweaver tutorial, you’ll learn how to add text and images to web pages to create an immersive and interactive experience for your visitors. Text and images are the building blocks of most websites. Dreamweaver Tutorial: Adding Text and Images