Ir para conteúdo
Kazz

Tamanho do list-style-image

Recommended Posts

Galera estou  tendo problemas para diminuir o tamanho   da  imagem do list-style-image(talvez seja um erro bem básico), desde já agradeço.

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <title> hmmmm </title>
        <meta charset="UTF-8">
        <meta name="author" content="Kelvin">
        <meta name="description" content="descrição bacanuda">
        <meta name="keywords" content="html5, tecnologia">
        <style type="text/css">
        body{
        	width: 50%;
        	border: solid 1px;
        }
        .c1{
			list-style-type: none;
		}
		.c2{
			list-style-type: circle;
		}
		.c3{
			list-style-type: square;
		}
		.c4{
			list-style-type: disc;
		}
		ul{
			list-style-image: url("imagens/checkmark.png");
		}
		li{
			margin: 20px auto;
		}
        </style>
    </head>
    <body>
    	<p>ipsum dolor sit amet, <span>consectetur</span> adipisicing elit, sed do eiusmod
    	uis nostrud exercitation ullamco laboris nisi ut aliip ex ea commodo
    	consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
    	cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
    	proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

		<ul>
			<li>a</li>
			<li>a</li>
			<li>a</li>
		</ul>
    </body>
</html>

 

Capturar.PNG

Compartilhar este post


Link para o post
Compartilhar em outros sites

Para mudar o tamanho da list-style-image faça assim:

 

Nos li você não declarou as classes, é melhor declarar:

 

		<ul>
			<li class="c1">a</li>
			<li class="c2">a</li>
			<li class="c3">a</li>
		</ul>

em questão do list-style-image eu acredito que você está tentando aumenta-lo, mas não consegue porque o body está com seu tamanho em 50%, faça dessa forma e veja se estou certa:

 

		body{
        	width: 150%;
        	border: solid 1px;
        }
		ul{
            list-style-image: url("imagens/china-2.jpg");
            width:60%;
		}

provavelmente o list-style-image aumentou, ao menos qui aumentou ...

se você quer que a borda fique em torno do ul faça dessa forma coloque o border dentro do UL não dentro do body pois o body é o corpo do site não do  list-style-image:

 

        <style type="text/css">
        body{
        	width: 150%;
        }
        .c1{
            list-style-type: none;
            width: 1%;
		}
		.c2{
            list-style-type: circle;
            width: 1%;
		}
		.c3{
            list-style-type: square;
            width: 1%;
		}
		.c4{
            list-style-type: disc;
            width: 1%;
		}
		ul{
            list-style-image: url("imagens/checkmark.png");
            border: solid 1px;
            width:60%;
		}
		li{
			margin: 20px auto;
		}
        </style>

Então arrume o WIDTH como você achar que fique melhor, qualquer coisa que precisar é só comentar aqui !!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por 4ly
      Olá. Bom basicamente eu tenho um botão âncora que leva até a aba de sobre do meu site, só que ele não tem animação, ele simplesmente "teleporta" para essa aba do nada isso não é legal. 
      Gostaria de saber algum código de JavaScript ou CSS para solucionar isso 
      Esse é o código : 
       
      <button id="explorer"><a href="#about">Explorar</a></button>
    • Por jgasper
      Boa tarde, preciso de ajuda, fiz o site para minha empresa de advocacia mas nao sei transformar em mobile, peguei template pronto e fiz modificações, nao sou bom em HTML, foi o que consegui fazer. Alguem pode me ajudar a transformar ele em responsivo? só fazendo o menu funcionar para celular?
       
      Os arquivos do site estao em: https://mega.nz/#!AEAUxa5Z!EwFVVhgaJeJg6DTFpzUfi0vnrULPzI8YI9I0-XJwaE8
       
      Agradeço desde ja.
    • Por mpcarvalho
      Estou com uma dúvida e revirei o forum e a internet e não achei solução.
       
      Criei um template em HTML para um APP hibrido, porem quando utilizado na versão mobile, ao clicar em qualquer link aparece uma marca de seleção antes de mudar de página. Gostaria de saber como remover isso. Segue imagens para explanar melhor minha dúvida.
       

    • Por Artes Ussler
      Bom dia
       
      Alguns navegadores sublinham ou trocam a cor dos números de telefones que estão no site.
       
      Como faço para remover isso?
       
      Se alguém puder ajudar, eu fico grato.
    • Por freitaz
      Bom eu criei um sistema de cadastro, estava tudo ok, no localhost, mas quando subi para o servidor, teve paginas que não carregou o html, 
      e ficou dessa forma

       
      Gostaria de ajuda, e desde já agradeço! 
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.