CSS esconde balas

A folha de estilo em cascata é um tipo adicional da linguagem HTML usada para adicionar diferentes sabores de estilo no conteúdo HTML definido e criado dentro das tags html. Uma página da web, seja um site estático ou dinâmico, é desenvolvido usando os três idiomas básicos: HTML, CSS e JavaScript. Mas nossa preocupação é com os dois primeiros idiomas, HTML e CSS. Ambos os idiomas se complementam no desenvolvimento e no design da página da web usando . CSS é composto principalmente por três tipos: CSS em linha, interna e externa.

Neste artigo, usamos o CSS embutido e interno para explicar as tags do CSS. O usuário deve ter algum conhecimento sobre tags HTML e CSS. Vindo para o nosso tópico em discussão, falaremos sobre as balas que desempenham um papel significativo no alinhamento e na montagem do conteúdo, texto ou imagens, etc., no site para criar uma aparência estética do site para o usuário.

Listas de CSS

Quando falamos sobre exibir parte de nosso conteúdo no site de uma maneira específica de demonstração vertical, encontramos as listas HTML. Este recurso é usado para exibir o texto na forma de balas. Os dois tipos de listas estão em html.

• Lista ordenada
  1. Lista não ordenada

     Ambos os tipos são estilizados através das balas CSS. Sempre que criamos as listas, elas são formadas usando balas ou marcadores. A lista ordenada contém a numeração dos dados. Enquanto a lista não ordenada contém discos, círculos, quadrados ou qualquer outra forma, tornando a forma de bala personalizável.

     Às vezes, não precisamos de nenhuma bala para ser adicionada à lista. Simplesmente queremos que o texto apareça na página sem nenhum símbolo ou sinal. Nós apenas desejamos uma lista simples sem balas. Isso é feito utilizando uma propriedade CSS que é a propriedade do tipo CSS no estilo de lista.

     Propriedade do tipo CSS List-Syle

     Esta é a propriedade do CSS que lida com o estilo dos marcadores dos itens da lista. Esta propriedade é essencial quando precisamos aplicar qualquer bala na lista ou se queremos remover ou ocultar a bala padrão. Usamos essa propriedade com as classes e IDs para especificar a lista na qual precisamos aplicar o estilo das balas. A sintaxe básica usada para a propriedade CSS List é a seguinte:

     Tipo de estilo de lista: disco;

     Isso está escrito dentro da tag de estilo à qual esse efeito deve ser aplicado. Existem diferentes tipos de valores de propriedade que são aplicados nas listas ordenadas e não ordenadas. Poucos deles são mencionados no seguinte:

     Disco, círculo, quadrado, decimal, baixo-romano, superior-romano, latina inferior e superior, alfa inferior, nenhum.

     Agora, usamos uma das balas para mostrar a implementação de amostra da lista com uma bala em forma de disco.

     Usamos um código para simplesmente exibir a lista e as balas usadas para definir uma lista por padrão. Não é necessário sempre descrever o tipo de balas para a lista. Por padrão, um tipo específico de bala é selecionado em HTML. Mas aqui, usamos a bala em forma de disco dentro do código para explicar a declaração da lista. Primeiro, considere a seção do HTML. Depois de usar um título simples, usamos uma lista não ordenada. Um estilo embutido é usado aqui.

     Isso mostra o tipo de bala a ser aplicado à lista não ordenada. Dentro de

     Tag, usamos as três listas. Cada linha usa o
     • tag a ser declarado. E então o
     A tag está fechada. Na seção da cabeça, fizemos algum estilo do título, dando -lhe cor. Também podemos usar o estilo de lista na parte da cabeça como o estilo interno.

     Código HTML e CSS

     Salve este código e depois executamos este arquivo HTML do editor de texto no navegador.

     Saída:

     Você verá que todos os itens estão escritos na lista. Para a lista ordenada, você pode usar o decimal, baixo alfa, baixo romano, etc. Usando a mesma propriedade do tipo no estilo de lista.

     Ocultar balas

     Ao usar o recurso do tipo CSS List no tipo de lista, também podemos ocultar as balas. Para esse fim, não especificaremos o nome da bala, mas usaremos o "nenhum" como o valor da propriedade. A sintaxe do estilo básico para a lista ocultar as balas é a seguinte:

     Nesta implementação, usamos uma lista não ordenada, para exibir as listas com balas e uma sem balas. Então, comece com a parte da cabeça do código HTML. Adicione um estilo ao título. O próximo estilo é para a lista não ordenada com um ID removido. Dentro do ID, usamos a propriedade do tipo no estilo de lista sem valor.

     Ul # remove
     Tipo no estilo de lista: nenhum;
     Preenchimento: 0;

     O preenchimento é a distância entre as linhas da lista. Esse recurso que adicionamos esconde as balas da lista. Da mesma forma, para ambas as listas, usamos os alinhamentos para o lado esquerdo e direito da página.

     Código HTML CSS:

     Após a parte da cabeça dentro do corpo, usamos um título primeiro. Uma div é criada e alinhada à esquerda de acordo com o CSS. Em seguida, uma lista simples não ordenada é declarada que tenha balas com ela porque não usamos o ID de remoção com esta lista. Todos os nomes de sujeitos estão escritos em cada lista. Em seguida, fechamos a lista não ordenada e o contêiner div.

     Em seguida, é a classe div novamente que é colocada ao lado da div anterior. Usamos um ID com a lista. Por causa desse ID, o estilo "nenhum" é aplicado e as balas estão ocultas.

     Todos os itens da lista são declarados dentro da lista. Feche a lista, div e o corpo HTML.

     Código corporal HTML:

     Execute o arquivo HTML no navegador. Você verá que uma página da web é formada. Um lado da lista tem balas e o outro lado não tem balas. Dessa forma, este tipo de listão CSS nos ajuda a estilizar as balas ou removê-las da lista.

     Saída:

     Conclusão

     Neste artigo, pretendemos lançar uma luz sobre algumas propriedades básicas e importantes em CSS e HTML. No início, introduzimos algum conhecimento básico de CSS e HTML destacando os tipos de CSS. Entre os três tipos, focamos no estilo interno com a propriedade do CSS em discussão. Em seguida, explicamos uma parte importante da página da web html que é usada para criar e alinhar o conteúdo da página em uma linha vertical formando uma lista. Ambos os tipos de listas também são introduzidos com diferentes formas e tipos de balas. Em seguida, é explicada a propriedade do tipo CSS na lista de listas que é um ingrediente essencial para modelar ou remover o layout de balas.

     Na implementação da parte do código, primeiro implementamos um exemplo para elaborar o funcionamento dessa propriedade de estilo junto com as balas na lista não ordenada. O segundo exemplo explica o uso combinado da propriedade Style para adicionar ou remover as balas da lista.