Ir para conteúdo

POWERED BY:

Sherlock02

Members
  • Total de itens

    43
  • Registro em

  • Última visita

Tudo que Sherlock02 postou

  1. Olá, Eu não sou muito fã de tabelas e não tenho como ajudar, mas ao menos que seja para aprendizado, não é uma boa prática usar a tabela aqui. As tabelas são usadas apenas para apresentação de dados tabulares (ou emails de html). Para esse caso, o recomendado seria flexbox ou grid.
  2. Sherlock02

    Projeto de Branding

    Lindo! O logo e a tipografia ficaram lindo e a apresentação ficou ótima!
  3. Sherlock02

    VSCode mover bloco para esquerda

    Fiz isso e achei o Outdent Line. O código para recuar é Ctrl + ´ Muito obrigada!
  4. Sherlock02

    VSCode mover bloco para esquerda

    Olá, pessoal. Não tenho certeza de que este é o fórum correto para essa pergunta, mas então. Eu sempre usei o Brackets como editor e estou tentando migrar para o VSCode. Só que eu não estou conseguindo descobrir como eu movo o bloco selecionado para a esquerda (recuo). Se eu pressiono Ctrl + [, ele move o bloco para a direita e está ok. Mas se eu tento trazer o bloco para a esquerda e pressiono Ctrl + ], ele abre uma nova página com o mesmo conteúdo. Como faço para mover o bloco para a esquerda?
  5. Sherlock02

    Proteger código fonte contra cópias.

    Olá, Você pode utilizar javascript ou jquery para desabilitar o ctrl + u e o botão direito, e ainda obfuscar o código. Porém isso serve mais para leigos. É praticamente impossível bloquear completamente. Sempre dá para dar um jeitinho. https://stackoverflow.com/questions/20372394/how-to-disable-ctrlu-using-javascript Abraços!
  6. Sherlock02

    Como criar conteúdo responsivo para página?

    Olá, recomendo usar o flexbox. Há vários exemplos no codepen e explicação nos sites: https://origamid.com/projetos/flexbox-guia-completo. https://www.alura.com.br/artigos/css-guia-do-flexbox. https://triangulo.dev/posts/guia-completo-flexbox. Abraços!
  7. Sherlock02

    Linguagem plataforma R&S

    Olá, foi como o Matheus disse. HTML e CSS é ótimo para começar, e de linguagem de programação, além do PHP eu indicaria o Javascript, que possui o maior número de vagas no mercado de trabalho. Abraços!
  8. Sherlock02

    Meu site não atualiza nada além do header

    Olá, Você não fechou o form com > <form method="POST"> <table width="50%">
  9. Sherlock02

    Pop-up toda ver que abrir o site.

    Pop-up é muito ~2010 hehe Brincadeiras à parte, como Omar explicou, é horrível, polui e ninguém lê. Uma opção que eu acho ótima é o sticky sidebar. Eu sempre presto atenção quando entro em algum site porque não é invasivo e está sempre ali na tela, além de fluir com o site naturalmente. Abraços!
  10. Sherlock02

    Container

    Olá, Não há necessidade de colocar <br> para quebra de linha. Outro ponto, é que <p> é usado para parágrafos, mas os títulos devem usar as tags adequadas de titulos. h1, h2, etc. Tentei não mexer muito no seu código original. Para alinhamento pode fazer com flex ou grid. body { background-color: rgb(255, 80, 92); } .container { font-family: Arial, Helvetica, sans-serif; font-size: 15px; color: white; background-color: rgb(255, 80, 92); width: 980px; margin: auto; } .caixas { display: grid; grid-template-columns: 1fr 1fr 1fr; } h1.title { text-transform: uppercase; /* transforma o titulo em letras maiusculas */ font-size: 18px; text-align: center; line-height: 45px; /* altura da linha do titulo principal */ } h2 { border: solid 1px white; font-size: 18px; line-height: 45px; /* altura da linha do titulo das caixas */ } .box01, .box02, .box03, .box04, .box05, .box06 { text-align: center; padding: 0 60px; /* diminua o espaçamento ou aumente conforme achar necessário */ } <div class="container"> <h1 class="title"> Veja mais sobre as nossas especialidades e como podemos ajudar você</h1> <div class="caixas"> <div class="box01"> <h2>UTI</h2> <p>Suporte Avançado de Ambulâncias e Suportes Básicos</p> </div> <div class="box02"> <h2>Área Protegida</h2> <p>Proporcionando total segurança em áreas de risco.</p> </div> <div class="box03"> <h2>Transferência</h2> <p>Intra-Hospitalar e Inter Hospitalar, Casa de repousos, Residenciais.</p> </div> <div class="box04"> <h2>Posto Fixo</h2> <p>Profissionais especializados para atuar em situações de urgências e emergência (médicos, enfermeiros e socorridos).</p> </div> <div class="box05"> <h2>Neonatal</h2> <p>Intra-Hospitalar e Inter Hospitalar, Casa de repousos, Residenciais. </div> <div class= "box06"> <h2>Eventos</h2> <p>Cobertura de Eventos Religiosos Corridas de Rua, Peladas de Futebol, Casas Noturnas, Eventos Culturais, Lutas Muay Thai, Boxe, Jiu Jitsu, Vale Tudo</p> </div> </div><!-- final caixas --> </div><!-- final container -->
  11. Sherlock02

    Transformar menu de um nível em dois com Javascript

    Resolvido! Só não consegui deletar o post.
  12. Olá, Eu preciso criar um menu com dois níveis utilizando Javascript. O código está assim: <div id="menu"> <ul> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> </ul> </div> Eu preciso transformá-lo em um segundo nível e inserir texto no estilo "Parent 1" no primeiro nível, dessa maneira: <div id="menu"> <ul> <li>Parent 1 <ul class="sub-menu"> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> </ul> </li> </ul> </div>
  13. Olá, Meu Deus, não consigo nem olhar internet por celular, aquilo me irrita, imagine programar qualquer coisa <link rel="stylesheet" href="meuarquivo.css"> Se estiver em alguma pasta (exemplo pasta com nome "estilo"). <link rel="stylesheet" href="estilo/meuarquivo.css"> A fonte (coloca junto com o código css geral): @font-face { font-family: Roboto; src: url(roboto.ttf); } Se for numa pasta, exemplo, chamada "fonts": @font-face { font-family: Roboto; src: url(fonts/roboto.ttf); } Abraços!
  14. Sherlock02

    Balões com html e css

    Olá, Onde tem bottom, você troca por top. Onde tem top, você troca por bottom. .bubble { background-color: #fff; border: 2px solid #333; border-radius: 5px; color: #333; display: inline-block; font: 16px/24px sans-serif; padding: 12px 24px; position: absolute; } /* Criando o triângulo */ .bubble.active:after, .bubble.active:before { border-left: 15px solid transparent; border-right: 15px solid transparent; border-bottom: 15px solid #fff; top: -15px; content: ''; left: 80%; margin-left: -15px; position: absolute; } /* Criando a borda do triângulo */ .bubble.active:before { border-left: 18px solid transparent; border-right: 18px solid transparent; border-bottom: 18px solid; border-bottom-color: inherit; top: -18px; margin-left: -18px; } Abraços!
  15. Olá, Se eu entendi direito, não seria apenas clicar no vídeo em questão e ir em "Compartilhar". Aí tem a opção "embeded" e "Código comum", tipo o Youtube. Escolhi um vídeo aleatório de exemplo. Seria só copiar o link e inserir no site que ele carregará.
  16. Sherlock02

    linhas pontilhadas

    Olá, Tem algumas soluções já prontas no Codepen: 1- Com tabela: https://codepen.io/Paulie-D/pen/bpMyBQ 2- Variação do primeiro com tabela: https://codepen.io/MalcolmMcAtee/pen/XdqQeG E esse que eu acho melhor, pois é com listas: https://codepen.io/Paulie-D/pen/xVjNZO/ Obs.: Não sei qual curso você fez, mas html e css é complicado no começo, mesmo sendo uma linguagem simples, mas o ideal é aprender na prática mesmo. Levei quase um ano para pegar o jeitinho, mas comecei com o básico (caixas simples no blogger e personalizando listas, quotes, etc.), para depois ir avançando. Muita coisa você vai encontrar nesses sites: https://www.maujor.com https://www.w3schools.com (inglês) https://developer.mozilla.org/pt-BR/docs/Aprender E principalmente procure códigos no Codepen (só que é em inglês apenas). Lá tem muita coisa boa. Abraços e bons estudos!
  17. Sherlock02

    Flip de rotação invade o rodapé

    Que bom que conseguiu! Abraços!
  18. Sherlock02

    Flip de rotação invade o rodapé

    Olá, Teria como você tirar um print de como está no seu site de testes e outra imagem representando o que você gostaria de fazer? Porque se você realmente tentar deixar o footer fixed, é impossível ele não invadir, porque é como colocar um menu fixo no topo. A função dele é ficar sobre qualquer outro elemento da página. Agora você diz que o flip invade o rodapé, e não o rodapé que invade o flip, e no exemplo que te enviei isso não acontece. Cada um está em seu próprio bloco.
  19. Sherlock02

    Borda externa - Efeito hover

    Olá, Segue: .photo-effect img { border: 4px solid transparent; -webkit-border-radius:80px; -moz-border-radius:80px; border-radius:80px; } .photo-effect img:hover { border: 4px solid #777; } <div class="photo-effect"> <img class="effect" src="https://source.unsplash.com//WNoLnJo7tS8/100x100"> </div> Resultado: https://jsfiddle.net/du6oLjre. Caso prefira, aplica um efeito transition para deixá-lo mais suave. Abraços!
  20. Sherlock02

    Flip de rotação invade o rodapé

    Olá, Eu não entendi exatamente o que você quis dizer, porque basta trocar o código por width: 100%. .container{ width: 100%; height: 450px; margin: 0 auto; display: block; position: relative; background: gray; } Aqui está o exemplo do código trocando somente o width de pixels para porcentagem ocupando a largura total, e ainda acrescentei um header, só para você ver como ficaria: Redimensione a tela para ver a versão mobile e desktop. https://jsfiddle.net/7s40zkja O único "problema" do seu código é ter colocado um footer fixo (na verdade não é um problema, só é estranho). Eu pensei que fosse sua preferência, mas agora acho que entendi que é a isso que você estava se referindo. Substitua esse código: footer{ position: fixed; bottom: 0px; width: 100%; background: #111; } Por esse: footer{ position: relative; bottom: 0px; width: 100%; background: #111; } E o resultado será esse: https://jsfiddle.net/x4tfv98m Seria isso o que você precisava?
  21. Sherlock02

    Flip de rotação invade o rodapé

    Olá, Basta acrescentar uma div "container" com o tamanho que deseja e o position relative. <div class="container"> <center> <div class="flip-container"> <div class="flipper"> <div class="front"> <img src="https://d3mwk3f7r8fv9u.cloudfront.net/images/zohO24tyN2WB8etR3nhZPvhf.png" /> </div> <div class="back"> <img src="https://d3mwk3f7r8fv9u.cloudfront.net/images/XkAkTVqVPbLB3cK5njqdun66.png" /> </div> </div> </div> </center> </div><!-- container relative --> .container{ width: 500px; max-width: 100%; height: 450px; margin: 0 auto; display: block; position: relative; background: gray; } O position absolute tem que ficar dentro do relative. Isso acontece porque o "absoluto" precisa de um ponto de referência. Aqui tem a explicação: https://tableless.com.br/propriedade-position-do-css. Abraços!
  22. Sherlock02

    Publicação de HTML

    Olá, O professor pediu especificamente para você "PUBLICAR" o site? Ou simplesmente fazer? São coisas totalmente diferentes e eu creio que ele não queira o site publicado, pois, caso contrário ele teria que ter orientado como e onde fazê-lo. Falhou na orientação para os alunos. Você pode criar um arquivo HTML offline mesmo (nomedoseuprojeto.html) e inserir a estrutura normal de um site. Se você precisar publicá-lo, teria que ser opções gratuitas e é praticamente impossível encontrar algo de qualidade (tem a Hostinger seu eu não me engano, que é free, mas é tão ruim que nem de graça eu recomendaria usar). E ainda as opções blogger e tumblr (que também exigem conhecimentos e tags específicas do site deles e já fugiria do padrão html). Boa sorte.
  23. Sherlock02

    Cria tabela de esquema com dias da semana

    Olá, Você colocou no tópico HTML e CSS, marcou a tag PHP e comentou que é mysql. Fica difícil saber o que deseja. Mas se for HTML e CSS, que é onde você colocou o tópico, basta usar esse código: <div class="container"> <table> <tr> <th>Segunda-feira</th> <th>Terça-feira</th> <th>Quarta-feira</th> <th>Quinta-feira</th> <th>Sexta-feira</th> <th>Sábado</th> <th>Domingo</th> </tr> <tr> <td>Cachaça</td> <td>Andrea Nunes</td> <td>Carlos Maia</td> <td>Nome Cliente quinta-feira</td> <td>Nome Cliente sexta-feira</td> <td>Nome Cliente sábado</td> <td>Nome Cliente domingo</td> </tr> <tr> <td>12h50 até 13h25</td> <td>11h até 14h</td> <td>15h até 18h</td> <td>Horário Cliente quinta-feira</td> <td>Horário Cliente sexta-feira</td> <td>Horário Cliente sábado</td> <td>Horário Cliente domingo</td> </tr> <tr> <td>Linha 3 - Segunda-feira</td> <td>Linha 3 - Terça-feira</td> <td>Linha 3 - Quarta-feira</td> <td>Linha 3 - Quinta-feira</td> <td>Linha 3 - Sexta-feira</td> <td>Linha 3 - Sábado</td> <td>Linha 3 - Domingo</td> </tr> </table> </div> E o css básico: .container{max-width:100%;width:800px;} table { width: 100%; border-collapse: collapse; } td, th { border: 1px solid #ccc; text-align: left; padding: 5px; } Resultado fica assim: https://jsfiddle.net/rgb6mtv Abraços
  24. Sherlock02

    Mudança do layout em select e buttons

    Olá Rebeca, O erro 404 é sobre permissão. Ou o arquivo não existe ou o endereço está incorreto. Mas você disse que isso já foi corrigido. Será que você corrigiu e apagou algum endereço necessário para o seu select funcionar? Tipo: <script src=".../jquery/meujs.js"></script> Também percebi que você uma aspa e depois, duas aspas no código. Tente alterar isso, colocando sempre duas aspas. Às vezes pode ser um errinho bobo. <div class="col s3"> <select name="tipo" class="browser-default"> <option value="" disabled selected>Tipo</option> <option value="Casa" class="tipo">Casa</option> <option value="Apartamento" class="tipo">Apartamento</option> <option>Sobrado</option> <option>Edicula</option> <option>KitNet</option> <option>Flat</option> <option>Sala Comercial</option> <option>Loja</option> <option>Galpão</option> <option>Terreno</option> <option>Fazenda</option> </select> </div>
  25. Sherlock02

    Estilizar TR que tenha checkbox marcado

    Olá, A boa notícia é que dá para fazer, mas a ruim, é que não com css hehe Eu encontrei soluções semelhantes: (Não sei se pelas regras do forum pode ser colocado links externos aqui, mas enfim) https://pt.stackoverflow.com/questions/246777/css-ao-clicar-em-um-checkbox-pintar-uma-td E essa também: https://codepen.io/diegobdev/pen/vGoqKW Abraços!
×

Informação importante

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