Recipe page solução, com flex, variáveis e design mobile

Community feedback

• 

  Bernardo Poggioni•5,360

  @R3ygoskiPosted 6 months ago

  Olá mais uma vez Isabela, e mais uma vez parabéns pela conclusão de mais um projeto, você está indo bem.

  Sobre sua duvida, sim, tem como alterar o tamanho dos bullets (bolinha), e também tem como alterar a fonte dos numerais da lista ordenada, veja os exemplos a seguir, nele irei mostrar como aumentar o bullet e também como alterar o font-family.

  Suponhamos que temos esse HTML:

    <div>
      <ol>
        <li>A</li>
        <li>B</li>
      </ol>
    </div>
  

  O seu CSS ficaria assim:

  div > ol > li::marker {
    color: red; /* Alterar a cor do bullet ou numeral */
    font-size: 2rem; /* Alterar o tamanho do bullet ou numeral*/
    font-family: 'Arial', sans-serif; /* Alterar a fonte do bullet ou numeral */
  }
  

  Edit: Você faz a alteração dos bullets/numerais da lista utilizando a pseudo-classe ::marker na sua li.

  E uma dica, ao invés de utilizar o list-style-type como você fez, você poderia no seu reset, não ter colocado o list-style: none;, que dessa forma, já viria os valores por padrão. E o valor padrão da <ul> já são os bullets.

  E uma dica rápida, quanto ao seu HTML, você pegou o jeito de como utilizar as tags semânticas, está muito bem feito parabéns, e a dica é de que as <div> que representam cada seção do seu <article>, poderiam ser <section>.

  E de resto é isso, meus parabéns, você vem se aprimorando bastante e seu projeto está muito bem feito, continue assim. Caso tenha ficado alguma duvida, já sabe, só perguntar abaixo.

  0