Jump to content
  • 0
CrisRodrigues

Zoom na pagina

Question

4 answers to this question

Recommended Posts

  • 0

Se for referente quando você entra no seu navegador, é só dar o comando "Ctrl+" para aumentar o zoom e o contrário, para baixar o zoom.

Share this post


Link to post
Share on other sites
  • 0
7 horas atrás, Kimo Gordinho disse:

Se for referente quando você entra no seu navegador, é só dar o comando "Ctrl+" para aumentar o zoom e o contrário, para baixar o zoom.

Amigo na próxima veja as tags, quero deixar um zoom fixo por css, eu sei como aumentar ou diminuir o zoom no navegador.

Share this post


Link to post
Share on other sites
  • 0

Com css, você pode usar o transform: scale() para aumentar as coisas. Dentro dos parenteses você regula o quanto quer aumentar, por exemplo: transform: scale(2) multiplica por 2 o tamanho das coisas.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By Camilavip
      Oi, tenho um flip para virar a imagem, bem pequeno e funcional, mas ao colocar um rodapé, ele simplesmente invade esse rodapé
      Creio que tem haver alguma coisa com o position: absolute, mas não entendo nada de css
       
      <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"> </head> <body> <!-- CSS DO FLIP --> <style> .flip-container:hover .flipper{ transform: rotateY(180deg); /* se quiser uma animação na vertical, troque por rotateX(180deg) */ } .flipper{ width: 100%; height: 100%; transition: transform 0.8s; transform-style: preserve-3d; } .front, .back{ position: absolute; width: 100%; height: 100%; } .back{ transform: rotateY(180deg); } </style> <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> <!-- AQUI COMEÇA O RODAPÉ --> <!-- CSS DO RODAPÉ --> <style> @import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap'); *{ margin: 0; padding: 0; color: #d9d9d9; box-sizing: border-box; font-family: 'Poppins', sans-serif; } .content1{ position: relative; margin: 130px auto; text-align: center; padding: 0 20px; } .content1 .text{ font-size: 2.5rem; font-weight: 600; color: #202020; } .content1 .p{ font-size: 2.1875rem; font-weight: 600; color: #202020; } footer{ position: fixed; bottom: 0px; width: 100%; background: #111; } .main-content{ display: flex; } .main-content .box{ flex-basis: 50%; padding: 10px 20px; } .box h2{ font-size: 1.125rem; font-weight: 600; text-transform: uppercase; } .box .content{ margin: 20px 0 0 0; position: relative; } .box .content:before{ position: absolute; content: ''; top: -10px; height: 2px; width: 100%; background: #1a1a1a; } .box .content:after{ position: absolute; content: ''; height: 2px; width: 15%; background: #f12020; top: -10px; } .left .content p{ text-align: justify; } .left .content .social{ margin: 20px 0 0 0; } .left .content .social a{ padding: 0 2px; } .left .content .social a span{ height: 40px; width: 40px; background: #1a1a1a; line-height: 40px; text-align: center; font-size: 18px; border-radius: 5px; transition: 0.3s; } .left .content .social a span:hover{ background: #f12020; } .center .content .fas{ font-size: 1.4375rem; background: #1a1a1a; height: 45px; width: 45px; line-height: 45px; text-align: center; border-radius: 50%; transition: 0.3s; cursor: pointer; } .center .content .fas:hover{ background: #f12020; } .center .content .text{ font-size: 1.0625rem; font-weight: 500; padding-left: 10px; } .center .content .phone{ margin: 15px 0; } .right form .text{ font-size: 1.0625rem; margin-bottom: 2px; color: #656565; } .right form .msg{ margin-top: 10px; } .right form input, .right form .msgForm{ width: 100%; font-size: 1.0625rem; background: #151515; padding-left: 10px; border: 1px solid #222222; } .right form input:focus, .right form .msgForm:focus{ outline-color: #3498db; } .right form input{ height: 35px; } .right form .btn{ margin-top: 10px; } .right form .btn button{ height: 40px; width: 100%; border: none; outline: none; background: #f12020; font-size: 1.0625rem; font-weight: 500; cursor: pointer; transition: .3s; } .right form .btn button:hover{ background: #000; } .bottom center{ padding: 5px; font-size: 0.9375rem; background: #151515; } .bottom center span{ color: #656565; } .bottom center a{ color: #f12020; text-decoration: none; } .bottom center a:hover{ text-decoration: underline; } @media screen and (max-width: 900px) { footer{ position: relative; bottom: 0px; } .main-content{ flex-wrap: wrap; flex-direction: column; } .main-content .box{ margin: 5px 0; } } </style> <div class="content1"> <div class="text"> Fully Responsive Footer Section</div> <div class="p"> HTML and CSS (Flexbox)</div> </div> <footer> <div class="main-content"> <div class="left box"> <h2> About us</h2> <div class="content"> <p> CodinNepal is a YouTube channel where you can learn web designing, web development, ui/ux designing, html css tutorial, hover animation and effects, javascript and jquery tutorial and related so on.</p> <div class="social"> <a href="https://facebook.com/coding.np"><span class="fab fa-facebook-f"></span></a> <a href="#"><span class="fab fa-twitter"></span></a> <a href="https://instagram.com/coding.np"><span class="fab fa-instagram"></span></a> <a href="https://youtube.com/c/codingnepal"><span class="fab fa-youtube"></span></a> </div> </div> </div> <div class="center box"> <h2> Address</h2> <div class="content"> <div class="place"> <span class="fas fa-map-marker-alt"></span> <span class="text">Birendranagar, Surkhet</span> </div> <div class="phone"> <span class="fas fa-phone-alt"></span> <span class="text">+089-765432100</span> </div> <div class="email"> <span class="fas fa-envelope"></span> <span class="text">abc@example.com</span> </div> </div> </div> <div class="right box"> <h2> Contact us</h2> <div class="content"> <form action="#"> <div class="email"> <div class="text"> Email *</div> <input type="email" required> </div> <div class="msg"> <div class="text"> Message *</div> <!-- NOTE: Due to more textarea tag I got an error. So I changed the textarea name to changeit. Please change that changeit name to textarea --> <changeit id=".msgForm" rows="2" cols="25" required></changeit> <!-- replace this changeit name to textarea --> <br /> <div class="btn"> <button type="submit">Send</button> </div> <div class="bottom"> <center> <span class="credit">Created By <a href="https://youtube.com/c/codingnepal">CodingNepal</a> | </span> <span class="far fa-copyright"></span> 2020 All rights reserved. </center> </div> </body> </html>  
    • By Kemily
      Eu preciso de ajuda para poder publicar meu site.
      O professor mandou faze-lo em HTML e CSS e eu fiz mas eu não sei postar e manter as imagens.
      Quando consegui postar as imagens não foram junto.
      O link q consegui fazer sem as imagens ficou assim:
       
      http://hyundai.droppages.com/
    • By danicarla
      Olá pessoas,

      Estou tentando fazer uma versão de impressão usando CSS eu queria colocar um cabeçalho e um rodapé em todas as paginas,  O problema é que o conteúdo vem do banco de dados,  e dependendo do tamanho dos parágrafos em algumas vezes o texto acaba ficando em cima do cabeçalho ou do rodapé.. alguém tem alguma idéia de como posso fazer isso?
       
      Meu cód está assim:
       
      header {font-family:Arial;font-size: 22px;color: #000;text-align: center;} footer {font-family:Arial;font-size: 10px; color: #CD090C;text-align: center;} article {font-family:Arial;font-size: 14px; color: #000;text-align: justify;} @page {size: A4;margin: 11mm 17mm 17mm 17mm;} @media print { header {position: fixed;top: 0;} footer {position: fixed;bottom: 0;} article {position: relative;top:40px;} .content-block, p {top:40px;page-break-inside: avoid;} html, body {width: 210mm;height: 297mm;} } E no HTML
       
      <header>CABEÇALHO</header> <article>Conteudo.. texto.. etc..</article> <footer>Texto do Rodapé</footer>  
    • By templateonweb
      Hi,
      Many of you want Bootstrap website templates. In this way, you have to develop a wonderful website.
      As this is the cheapest and fastest way to reach over the world. If you are interested in making a website by using Bootstrap website templates, then here I am sharing a website link that provides free website designs as Bootstrap website templates.
      If you are interested in then you can visit the site and use the best quality of Bootstrap website templates.
       
      Please visit: Bootstrap Website Templates
       
               
       
       
    • By rtavix
      Pessoal, alguem sabe como eu posso transformar esse relatório em html? comecei a implementar o código de html, mas não está igual rs. Esse é meu html, que não consegui fazer ficar igual da imagem em anexo, se alguém puder me ajudar agradeço.
       
      <style> table { border-collapse: collapse; margin-left: 0; } div.conteudodatabela { overflow: visible; } table > tbody { overflow: visible; } /*adds control for test purposes*/ thead td { font-size: 11pt; } tfoot td { text-align: center; font-size: 9pt; } thead { display: table-header-group; margin-bottom: 10px } tfoot { display: table-footer-group; } thead th, thead td { position: static; } thead tr { position: static; } /*prevent problem if print after scrolling table*/ table tfoot tr { position: static; } /* table */ .checkbox { width: 20px; height: 20px; border: 1px solid black; text-align: center; float: left; margin-right: 10px; font-size: 150%; } .foo { writing-mode: vertical-lr; } .border { border: 1px solid black; } table{ font-weight: 800; font-size: 80%; width: 100%; margin: 10px; margin-bottom: 20px; } .bg{ background: rgb(230,230,230); } .h1{ font-size: 120%; } .center{ text-align: center; } .semi-full-width{ width: 80%; } .row{ margin: 50px; } .p-1{ margin: 30px; margin-bottom: 40px; margin-top: 40px; padding: 8px; } .textovertical{ writing-mode: horizontal-tb; width:11px; word-wrap: break-word; font-family: Arial, Helvetica, sans-serif; white-space: pre-wrap; } tr{ margin: 10px; margin-bottom: 50px; } .m-r{ margin-right: 830px; } .padding_master { padding: 30px; } .conteiner{ font-size: 90%; } .table td{ border: 1px solid black; padding: 1px; margin: 0px; } .lineBottom-inLine{ /* <p> */ border-bottom: 1px solid black; display: inline; } .lineBottom{ /* <p> */ border-bottom: 1px solid black; } .no-border{ border: 0px; } .no-space{ margin: 1px; padding: 1px; } .no-bold{ font-weight: 500; } .space-p p{ margin: 1px; padding: 1px; } .tr-center td{ text-align: center; } .regras p{ margin: 0px; } </style> <style type="text/css" media="print"> @page { size: auto; margin: 0mm; } </style> <div class="table" runat="server" style="margin: 1 auto;"> <div> <table style="padding: 0px; margin: 0px;" class="no-bold"> <tr class="center"> <td class="textovertical">Contratação</td> <td colspan="2">Origem Dívida</td> <td>Credor</td> <td colspan="2">Devedor</td> <td>Credor</td> </tr> <tr class="tr-center"> <td class="textovertical" id="border" rowspan="4" style="width:43px">Direta</td> <td class="textovertical" id="border" colspan="" rowspan="1">Interna</td> <td id="border" colspan="2" rowspan="">teste25</td> <td id="border" colspan="2" rowspan="">teste12</td> <td>teste 1</td> </tr> <tr class="tr-center"> <td id="border" rowspan="1">Externa</td> <td id="border" colspan="2" rowspan="3"> teste20</td> <td id="border" colspan="2" rowspan="">teste40</td> <td>teste 1</td> </tr> </table> </div> <br/> <br/> </div>  
      Essa é a imagem  do link de como deveria ficar a estrutura do relatório.
      https://drive.google.com/file/d/1cgxh2IKu6KcVEMmLEEgorYqBtjpgHNgs/view?usp=sharing
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.