Work with a partner to implement the following user story:
As a user, I want to read a blog that uses visually appealing font styles.
Acceptance Criteria
It's done when the body font has the standard size of 16px.
It's done when paragraphs have a line height of 1.5 times the font height.
It's done when headings are 150–200% of the font size and have a font family of serif.
It's done when there is a margin of 2–5% on the heading, paragraph, and list.
It's done when the list is indented, has square bullet points, and has a font family of monospace.
Working with CSS should be a creative experience for you! Your end product should look as close to the solution as possible, but feel free to try out other looks!
📖 Implement Typographic Styles
Work with a partner to implement the following user story:
Acceptance Criteria
It's done when the body font has the standard size of 16px.
It's done when paragraphs have a line height of 1.5 times the font height.
It's done when headings are 150–200% of the font size and have a font family of
serif
.It's done when there is a margin of 2–5% on the heading, paragraph, and list.
It's done when the list is indented, has square bullet points, and has a font family of
monospace
.Working with CSS should be a creative experience for you! Your end product should look as close to the solution as possible, but feel free to try out other looks!
📝 Notes
Refer to the following documentation:
MDN Web Docs on fundamental text and font styling
Assets
The following image demonstrates the web application's appearance:
💡 Hints
font-weight
andfont-style
can you use to give the page a more personal touch?🏆 Bonus
If you have completed the activity and want to further your knowledge, work through the following challenge with your partner:
Use Google or another search engine to research this.
© 2022 Trilogy Education Services, LLC, a 2U, Inc. brand. Confidential and Proprietary. All Rights Reserved.