I am not getting "CSS rules to specify families" in google fonts

Question

I am trying to get the font family CSS (on the google font website) which is used to define font family properties for the selected font applied to content.

Usually, you see a code block "CSS rules to specify families" under link/import tag code on right side of screen – but the expected css text is currently missing.

Answer 1

you can use the code under the section "CSS rules to specify families" as:

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans"> 
body {
    font-family: 'Open Sans', sans-serif;
}

... hope this might be helpful.

Answer 2

In the "Selected Family" pane on right, you'll see a section with the code to embed in your HTML/ CSS files to import a font.

To use the tag, add the HTML tag to the section of your HTML file with the content to style.

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap">

Else, you can use @import selector on top of your CSS file to import fonts using the Google Font URL.

<style>
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
</style>

Now in your CSS file, you can use the code under the section "CSS rules to specify families" as:

/* Example CSS to apply the font family */
body {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
}

As you can see, you will be able to specify font-weights too if the desired weights are also imported in the URL as shown:

'https:// fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap'

Answer 3

Try this:

font-family:'Black Ops One',sans-serif;