用户投稿透过控制 p margin:5px auto; 调整文字上下间距
透过 @media screen and (max-width: @media screen and (min-width:
调整在各解析度 排版
<!DOCTYPE html><html><head><meta name="viewport" content="width=device-width, initial-scale=1.0"><script type="text/javascript" src="script/jquery-1.6.4.min.js"></script><style>body {min-width: 320px;font-family: 'microsoft yahei',Verdana,Arial,Helvetica,sans-serif;background-color:#21211F;-webkit-text-size-adjust: none}* { box-sizing: border-box;}.left { padding: 20px; float: left; width: 15%; /* The width is 20%, by default */}.main { padding: 20px; float: left; width: 60%; /* The width is 60%, by default */}.right { padding: 20px; float: left; width: 15%; /* The width is 20%, by default */}.logo img{ display:block; margin:auto;}.main{ display:block; margin:auto; text-align:center;}.main p{ color:#A2A2A2; font-size:16px; text-align:center; margin:5px auto;}.div_ip{ color:#A2A2A2; text-align:center; font-size:16px; font-weight:normal; margin-top:40px; margin-bottom:30px;}@media screen and (max-width: 800px) { .left, .main, .right { width: 100%; } .logo img{ display:block; margin:auto; height:104px; }}@media screen and (min-width: 801px) { .left, .main, .right { width: 100%; } .logo img{ display:block; margin:auto; height:170px; } .main p{ font-size:18px; margin:5px auto; } .div_ip{ font-size:18px; margin-top:80px; margin-bottom:60px; }}</style><script> $( document ).ready(function() { $.get('https://www.cloudflare.com/cdn-cgi/trace', function(data) { data = data.trim().split('\n').reduce(function(obj, pair) { pair = pair.split('='); return obj[pair[0]] = pair[1], obj; }, {}); $(".div_ip").text("Your IP/您的IP : "+data.ip); }); }); </script></head><body><div class="left"> <p></p></div><div class="main"> <div class="logo"><img src="images/tb-ipBlock.png" /></div> <div class="div_ip"></div> <p>您的所在地不在我们的服务允许范围内,</p> <p>我们暂时无法为您服务。敬请谅解!<br><br></p> <p>Due to the location in which you are trying to</p> <p>access to this page has been restricted.</p> <p>We apologize for the inconvenience caused.</p></div><div class="right"> <p></p></div></body></html>
微信扫一扫打赏
支付宝扫一扫打赏
