Transcript
Page 1: Google Fonts for Dreamweaver CS6

Here you will learn the steps to add Google font to one tag on your Dreamweaver CS6 page

Page 2: Google Fonts for Dreamweaver CS6

Create a new Dreamweaver page using 2 column fixed, left sidebar, header and footer

Page 3: Google Fonts for Dreamweaver CS6

Select the heading on the page. h1

Page 4: Google Fonts for Dreamweaver CS6

Go to www.google.com/webfonts

Page 5: Google Fonts for Dreamweaver CS6

Find a font you like and select Quick-use. Here you will see how long it takes to load and the code to be added to your web page.

Page 6: Google Fonts for Dreamweaver CS6

Open Dreamweaver html page to code view. Insert font code after <head>

Page 7: Google Fonts for Dreamweaver CS6

Select the heading on the page. <h1>

Page 8: Google Fonts for Dreamweaver CS6

Go to Properties panel choose Edit Rule> New Rule>

<New CSS Rule>

Page 9: Google Fonts for Dreamweaver CS6

New Selector Type> Choose Tag for all <h1> tags. Then click OK.

Page 10: Google Fonts for Dreamweaver CS6

Select font name and add to Font-family in Type panel with out any ‘’.

Page 11: Google Fonts for Dreamweaver CS6

Check to see if the h1 tag is your font. The new font fill not be seen until on viewed Live.

Page 12: Google Fonts for Dreamweaver CS6

Live view will show the font for <h1>. Also you can use a Class tag and add font family.


Recommended