Skip to main content
M
Matt0D44
Participant
September 11, 2020
Question

How do I change the font for selected text?

  • September 11, 2020
  • 3 replies
  • 237 views

In older versions of Dreamweaver, I could select (highlight) text with my mouse and use a menu to change the font of that text (e.g., from the default font to Courier new).  I have a brand new edition of Dreamweaver (Dreamweaver 2020?  The "Help >>AboutDreamweaver" just says 20.2)  and I can't figure out how to change the font of selected text without doing an inline style.  Is there a GUI-way to do what used to be so simple?  

    This topic has been closed for replies.

    3 replies

    Nancy OShea
    Community Expert
    Nancy OSheaCommunity Expert
    Community Expert
    September 11, 2020

    As Jon said, use a re-usable CSS class.  And if the font change occurs inline, use a <span> tag.

     

    <p>Default paragraph text here 
<span class="special_font">special font here</span> 
back to default paragraph text here.</p>

     

    Nancy O'Shea— Product User & Community Expert
    Jon Fritz
    Community Expert
    Jon FritzCommunity Expert
    Community Expert
    September 11, 2020

    Create a .css class using the font in either your external .css file, or in <style> tags in the <head> of the page.

    You then select it from the class dropdown menu in the Properties window.

    You can do it within the interface of the CSS Designer, it's sort of convoluted and simpler to just create by hand in Code View, but it can be done...

    1. In the CSS Designer Window, in the Sources sub heading, highlight the attached stylesheet or <style> tag
    2. Click the + next to the Selectors sub heading
    3. Create a new class selector by typing a . and then a meaningful name (something like .yourfontname)
    4. Click the + Next to the Properties sub heading
    5. Click the Text tab (second in from the left)
    6. Select the font-family property and set the font stack
    7. Highlight the text you want to affect in Design or Live View
    8. With the HTML button active in the Properties window, choose the Selector you made in Step 3

      B
      Community Expert
      Ben MCommunity Expert
      Community Expert
      September 11, 2020

      Click on Window-->Properties.  This will open the properties toolbar for you if it is not already open.  Then click the CSS tab on the left as CSS controls all styles on a document.  There is a font menu there to choose a pre-made font-stack or you can click "Manage Fonts" to make your own custom font stack and/or utilize web fonts.

      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices