กดถูกใจ เป็นกำลังใจให้เรา 😍

VIR9.COM

ขอบคุณน๊าา 🥰

Close

  • สร้างปุ่มที่ใช้ได้ทั้ง mobile phone และ desktop pc

    January 18, 2023
    <!DOCTYPE html>
<html>
  <head>
    <style>
      /* Default styles for all buttons */
      button {
        padding: 10px 20px;
        font-size: 16px;
        margin: 10px;
      }
      
      /* Media query styles for screens smaller than 768px */
      @media (max-width: 768px) {
        button {
          margin: 5px;
          font-size: 14px;
        }
      }
    </style>
  </head>
  <body>
    <button>Button 1</button>
    <button>Button 2</button>
    <button>Button 3</button>
  </body>
</html>
    เพิ่ม responsive
<meta name="viewport" content="width=device-width, initial-scale=1.0">
    Ex mti
<style>
/*@charset "utf-8";

html {font-size:62.5%; }
html.text-bigsize {font-size:72.5%; }

a:link, a:visited {color:#000; text-decoration:none; }
.desktop a:hover, a:active {color:#666; }

.page-center {width:1208px; max-width:calc(100vw - 30px); height:100%; position:relative; margin:0 auto; }
*/
.action-area {margin-top:19px; margin-left:-16px; overflow:hidden; }
.action-area a {display:block; float:left; background-color:#1595d3; position:relative; padding:10px 20px 10px 50px; margin-top:16px; margin-left:16px; font:normal 2.5rem/1.1em 'db_helvethaica_x'; color:#fff; }
.action-area a img {height:28px; display:block; position:absolute; left:12px; top:9px; margin-right:10px; }
</style>
<html class="desktop"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0, minimal-ui">

<!--<link rel="stylesheet" href="main.css">-->

<div class="action-area"><!--<div class="page-center">-->
<a href="https://www.vir9.com/" class="btn-style">เว็บไซต์สร้างเว็บไซต์ออนไลน์</a>
<a href="https://www.vir9.com/" class="btn-style">เว็บไซต์สร้างเว็บไซต์ออนไลน์0</a>
<a href="https://www.vir9.com/" class="btn-style">เว็บไซต์สร้างเว็บไซต์ออนไลน์1</a>
<a href="https://www.vir9.com/" class="btn-style">เว็บไซต์สร้างเว็บไซต์ออนไลน์2</a>					
<a href="https://www.vir9.com/" class="btn-style">เว็บไซต์สร้างเว็บไซต์ออนไลน์3</a>
</div>

เวอไนน์ไอคอร์ส

ประหยัดเวลากว่า 100 เท่า!

เวอไนน์เว็บไซต์⚡️
สร้างเว็บไซต์ ดูแลเว็บไซต์

Categories

Uncategorized