Question 214032 in Html Question posted in
Some basic documentation can be found here.

HTML AND CSS QUESTIONS

I’m just start learing html and css, and I just wonder if there a way to change the font size of the unorder list tag alone? –>

  • For example,
    only this part not the whole text –>(.) list 1

    Thank you so much for the answer.
    really appriciate it.!!

    • Tags:

    2

    Answers


    1. 0

      In order to customize the . of the list you need to style the ::marker Pseudo Element.

      li::marker {
  color: red;
  font-size: 2em;
}
      <ul>
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
  <li>Four</li>
  <li>Five</li>
</ul>

<ol>
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
  <li>Four</li>
  <li>Five</li>
</ol>

      Learn more about ::marker

      Login or Signup to reply.
    2. 0

      Yes, you can change the font size of the text in an unordered list (

        ) without affecting the rest of the page text by using CSS. Here’s an example:

      HTML:

      <ul>
<li>List item 1</li>
<li>List item 2</li>
<li class="small">List item 3</li>
<li>List item 4</li>

      In this example, the third list item has a class of “small”, which we will use to target it with CSS.

      CSS:

          <style>
    ul {
  font-size: 16px; /* set the font size for the entire unordered list */
}

ul li.small {
  font-size: 12px; /* set a smaller font size for list items with the "small" class */
}
</style>

      In this CSS example, we set the font size for the entire unordered list to 16 pixels using the ul selector. Then, we use the ul li.small selector to target only the list items with the "small" class, and set their font size to 12 pixels.
      This way, only the text in the third list item (with the "small" class) will have a smaller font size, while the rest of the list and the page text will remain unaffected.

      Login or Signup to reply.
    Please signup or login to give your own answer.

    Back To Top
    Search