Quiz - Typography and Colors in CSS

It seems like you are using an ad blocker. To enhance your experience and support our website, please consider:

Signing in to disable ads on our site.
Sign up if you don't have an account yet.
Or, disable your ad blocker by doing this:
- Click on the ad blocker icon in your browser's toolbar.
- Select "Pause on this site" or a similar option for INITAcademy.org.

Typography and Colors in CSS

This quiz tests your understanding of the essential CSS properties for styling text and typography, including text formatting, font usage, and colors.

Question 1 Which CSS property would you use to change the thickness of an underline?: text-shadow text-decoration-thickness font-weight line-height

Question 2 Which value for text-transform will make all letters uppercase?: lowercase capitalize uppercase none

Question 3 What is the correct way to include a Google Font in your HTML file?: Use an tag Use an tag <input type="radio" name="ans_115" id="ans_115_437" > <span class="selectmark"></span> </label> <label for="ans_115_438" class="article answer_option"> Use a <link> tag in the <head> section <input type="radio" name="ans_115" id="ans_115_438" > <span class="selectmark"></span> </label> <label for="ans_115_439" class="article answer_option"> Use a <script> tag <input type="radio" name="ans_115" id="ans_115_439" > <span class="selectmark"></span> </label> </dd> </dd> </dl> <dl class="question"> <dt> <h3>Question 4</h3> <h2>Which is NOT one of the five main font family groups in CSS?</h2> </dt> <dd> <label for="ans_118_448" class="article answer_option"> Serif <input type="radio" name="ans_118" id="ans_118_448" > <span class="selectmark"></span> </label> <label for="ans_118_449" class="article answer_option"> Sans-serif <input type="radio" name="ans_118" id="ans_118_449" > <span class="selectmark"></span> </label> <label for="ans_118_450" class="article answer_option"> Monospace <input type="radio" name="ans_118" id="ans_118_450" > <span class="selectmark"></span> </label> <label for="ans_118_451" class="article answer_option"> Gothic <input type="radio" name="ans_118" id="ans_118_451" > <span class="selectmark"></span> </label> </dd> </dd> </dl> <dl class="question"> <dt> <h3>Question 5</h3> <h2>What does the line-height property adjust?</h2> </dt> <dd> <label for="ans_113_428" class="article answer_option"> The space between words <input type="radio" name="ans_113" id="ans_113_428" > <span class="selectmark"></span> </label> <label for="ans_113_429" class="article answer_option"> The space between lines of text <input type="radio" name="ans_113" id="ans_113_429" > <span class="selectmark"></span> </label> <label for="ans_113_430" class="article answer_option"> The thickness of text <input type="radio" name="ans_113" id="ans_113_430" > <span class="selectmark"></span> </label> <label for="ans_113_431" class="article answer_option"> The position of text <input type="radio" name="ans_113" id="ans_113_431" > <span class="selectmark"></span> </label> </dd> </dd> </dl> <dl class="question"> <dt> <h3>Question 6</h3> <h2>What does the font-size property control in CSS?</h2> </dt> <dd> <label for="ans_111_420" class="article answer_option"> The size of text <input type="radio" name="ans_111" id="ans_111_420" > <span class="selectmark"></span> </label> <label for="ans_111_421" class="article answer_option"> The color of text <input type="radio" name="ans_111" id="ans_111_421" > <span class="selectmark"></span> </label> <label for="ans_111_422" class="article answer_option"> The type of font used <input type="radio" name="ans_111" id="ans_111_422" > <span class="selectmark"></span> </label> <label for="ans_111_423" class="article answer_option"> The alignment of text <input type="radio" name="ans_111" id="ans_111_423" > <span class="selectmark"></span> </label> </dd> </dd> </dl> <dl class="question"> <dt> <h3>Question 7</h3> <h2>What does the font-family property define?</h2> </dt> <dd> <label for="ans_117_444" class="article answer_option"> The size of text <input type="radio" name="ans_117" id="ans_117_444" > <span class="selectmark"></span> </label> <label for="ans_117_445" class="article answer_option"> The typeface of the text <input type="radio" name="ans_117" id="ans_117_445" > <span class="selectmark"></span> </label> <label for="ans_117_446" class="article answer_option"> The color of the text <input type="radio" name="ans_117" id="ans_117_446" > <span class="selectmark"></span> </label> <label for="ans_117_447" class="article answer_option"> The alignment of text <input type="radio" name="ans_117" id="ans_117_447" > <span class="selectmark"></span> </label> </dd> </dd> </dl> <dl class="question"> <dt> <h3>Question 8</h3> <h2>Which CSS property is used to center text horizontally within an element?</h2> </dt> <dd> <label for="ans_112_424" class="article answer_option"> text-transform <input type="radio" name="ans_112" id="ans_112_424" > <span class="selectmark"></span> </label> <label for="ans_112_425" class="article answer_option"> font-family <input type="radio" name="ans_112" id="ans_112_425" > <span class="selectmark"></span> </label> <label for="ans_112_426" class="article answer_option"> text-align <input type="radio" name="ans_112" id="ans_112_426" > <span class="selectmark"></span> </label> <label for="ans_112_427" class="article answer_option"> text-indent <input type="radio" name="ans_112" id="ans_112_427" > <span class="selectmark"></span> </label> </dd> </dd> </dl> <dl class="question"> <dt> <h3>Question 9</h3> <h2>Which CSS property is used to indent the first line of a paragraph?</h2> </dt> <dd> <label for="ans_120_456" class="article answer_option"> text-indent <input type="radio" name="ans_120" id="ans_120_456" > <span class="selectmark"></span> </label> <label for="ans_120_457" class="article answer_option"> line-height <input type="radio" name="ans_120" id="ans_120_457" > <span class="selectmark"></span> </label> <label for="ans_120_458" class="article answer_option"> padding <input type="radio" name="ans_120" id="ans_120_458" > <span class="selectmark"></span> </label> <label for="ans_120_459" class="article answer_option"> margin <input type="radio" name="ans_120" id="ans_120_459" > <span class="selectmark"></span> </label> </dd> </dd> </dl> <dl class="question"> <dt> <h3>Question 10</h3> <h2>What does the text-shadow property do?</h2> </dt> <dd> <label for="ans_119_452" class="article answer_option"> Adds a background color to text <input type="radio" name="ans_119" id="ans_119_452" > <span class="selectmark"></span> </label> <label for="ans_119_453" class="article answer_option"> Adds shadow effects to text <input type="radio" name="ans_119" id="ans_119_453" > <span class="selectmark"></span> </label> <label for="ans_119_454" class="article answer_option"> Changes the color of text <input type="radio" name="ans_119" id="ans_119_454" > <span class="selectmark"></span> </label> <label for="ans_119_455" class="article answer_option"> Underlines text <input type="radio" name="ans_119" id="ans_119_455" > <span class="selectmark"></span> </label> </dd> </dd> </dl> <div class="quiz-submit"> <label for="ready" class="quiz-status notification warning"> <i class="fas exclamation-circle"></i> Answer all the questions then submit. </label> <button class="smt_btn button disabled submit">Submit Answers</button> </div> </form> </section>   <footer> <div class="container"> <ul class="services"> <li> <a href="/circle">Discussions</a> </li> <li> <a style="padding-left:0;" href="/labs"> Labs </a> </li> <li> <a style="padding-left:0;" href="/quizzes"> Quiz </a> </li> <li> <a style="padding-left:0;" href="/wordbook"> Wordbook </a> </li> <li> <a style="padding-left:0;" href="/about-us"> About us </a> </li> <li> <a href="/faq"> Faq </a> </li> <li> <a href="/policy"> Terms & Policy </a> </li> <li> <a href="/advertise-with-us"> Advertise with us </a> </li> <li> <a href="/contact"> Contact </a> </li> </ul> <p>Copyright © 2015 - 2026 - Lancecourse.com • Except where noted, all rights reserved • Designed by zooboole</p> </div> </footer> </div>  <script async src="/assets/javascript/main.js"></script>  <script async src="https://www.googletagmanager.com/gtag/js?id=G-W57E40YCL4"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-W57E40YCL4'); </script> </body> </html>

Typography and Colors in CSS

Question 1

Which CSS property would you use to change the thickness of an underline?

Question 2

Which value for text-transform will make all letters uppercase?

Question 3

What is the correct way to include a Google Font in your HTML file?