zoukankan      html  css  js  c++  java
  • 手机页面宽度设置效果,去掉边框距离空白。

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
    <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
    <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><!--  -->
    <!-- <!DOCTYPE html> -->
    
    <html>
    <head>
    <base href="http://${header['host']}${pageContext.request.contextPath}/"/>
    <!-- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  -->
    <meta name="viewport" http-equiv="Content-Type" content="text/html; charset=UTF-8;width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes"><!-- -->
    <!-- <meta name="viewport" content="width=device-width, initial-scale=1" /> -->
    <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />  --> 
    
    <!-- <link type="text/css" rel="stylesheet" href="css/style.css" />
    <link type="text/css" rel="stylesheet" href="css/tableStyle.css"  /> -->
    <style type="text/css">
        body,th,td{margin:0;padding:0}
        table{border-collapse:collapse;border-spacing:0}
    </style>
    
    <title>营销活动</title>
    <script type="text/javascript">
    function checkForm(){
        document.getElementById("wymzBtn").disabled="disabled";  //设置禁用。
        return true;
        //return false;
    }
    </script>
    </head>
    <body style="background: #ffffff;">
    <form id="searchForm" action="activity/addMem" method="post" onsubmit="return checkForm();">
    <table id="t1" align="center">
        <tr><td align="center">
                <img alt="" src="images/hd/yymz${activity.id }.jpg" id="pic">
        </td></tr>
        <tr><td align="center">
            <table><tr><td align="center"><!-- <img id="pic" alt="" src="images/share.png" width="120px;"/> --></td>
            <td align="center"><br/>
                <c:if test="${hasTag == 1 }">
                    <img alt="" src="images/hd/nymz.png" width="160px;"/>
                </c:if>
                <c:if test="${hasTag == 0 && memNo != 0 }">
                    <!-- <a href="javascript:doSubmit();">222<img id="pic" alt="" src="images/hd/1rmb_in_2.png" width="320px;"/></a> -->
                    <input id="wymzBtn" type="image" src="images/hd/wymz.png" width="160px;" />
                </c:if>
                <!-- token错误找不到对应的memNo情况,Map返回为默认值的情况 -->
                <c:if test="${hasTag == 0 && memNo == 0 }">
                    <img alt="" src="images/hd/wymz.png" width="160px;"/>
                </c:if>    
                <br/><br/>
            </td>
            </tr></table>
        </td></tr>
        
        <%-- <tr><td align="center" style="font-weight: 700; font-size: 16px; color: #00a0ff; line-height: 180%;  100%; padding: 0 0 20px 0;">已有<strong>${amCount+100}</strong>人参与</td></tr>
         --%>
    </table>
        <input type="hidden" name="activityId" value="${activity.id }">
        <input type="hidden" name="memNo" value="${memNo }">
        <input type="hidden" name="token" value="${token }"> 
        <input type="hidden" name="carNo" value="${activity.otherInfo }"> 
    </form>
    <script type="text/javascript">
    var witdh =  document.body.clientWidth;  //动态获取屏幕宽度
    document.getElementById("pic").width=witdh;
    document.getElementById("t1").width=witdh;
    //alert("屏幕宽度是:"+witdh);
    
    </script>
    
    </body>
    </html>

    注意:重点是css代码

    body,th,td{margin:0;padding:0}
    table{border-collapse:collapse;border-spacing:0}
    body也是一个容器。也存在margin,padding设置~!
    
    
  • 相关阅读:
    Delphi实现在数据库中存取图像
    c#后台修改前台DOM的css属性示例代码
    jQuery编程中的一些核心方法简介
    jquery用ajax方式从后台获取json数据后如何将内容填充到下拉列表
    jQuery实现淡入淡出二级下拉导航菜单的方法
    jQuery实现瀑布流布局详解(PC和移动端)
    jQuery实用技巧必备
    jQuery链式操作实例分析
    谈谈Jquery ajax中success和complete有哪些不同点
    jquery密码强度校验
  • 原文地址:https://www.cnblogs.com/simpledev/p/3935579.html
Copyright © 2011-2022 走看看