Question

当我使用css + html并向gmail发送电子邮件时，css没有出现。当我在本地运行时只需/localhost/text.html即可显示css。我停滞不前。

问题是：以下代码如何在Gmail中显示？。

我有这样的代码（HTML + CSS）：

<!DOCTYPE HTML> <html>
<head>
    <!-- <htm><link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"></htm> -->
    <title>Email notification</title>
    <style> * {
            box-sizing: border-box; } .btn {background: #ffb300; background-image: -webkit-linear-gradient(top, #ffb300, #2980b9);  background-image: -moz-linear-gradient(top, #ffb300, #2980b9);  background-image: -ms-linear-gradient(top, #ffb300, #2980b9);  background-image: -o-linear-gradient(top, #ffb300, #2980b9);  background-image: linear-gradient(to bottom, #ffb300, #2980b9);  -webkit-border-radius: 7;  -moz-border-radius: 7;  border-radius: 7px;  font-family: Georgia;  color: #ffffff;  font-size: 15px;  background: #ffb300;  padding: 10px 20px 10px 20px;  text-decoration: none;} .btn:hover {  background: #cf9204;  background-image: -webkit-linear-gradient(top, #cf9204, #cf9204);  background-image: -moz-linear-gradient(top, #cf9204, #cf9204);  background-image: -ms-linear-gradient(top, #cf9204, #cf9204);  background-image: -o-linear-gradient(top, #cf9204, #cf9204);  background-image: linear-gradient(to bottom, #cf9204, #cf9204);  text-decoration: none;}          #header {
            box-sizing: border-box;
            width: 80%;
            height: 80px;
            margin: 0 auto;
            padding: 0px;
            color: #fff;
            text-align: center;
            background-color: #000;
            font-family: Open Sans,Arial,sans-serif;
            border-radius: 10px 10px 0px 0px;
        }

        #footer {

            width: 80%;margin: 0 auto;clear: both;text-align: center;padding: 20px 0;font-family: Verdena;background-color: #000; color: #838779;
            border-radius: 0px 0px 10px 10px;
            line-height: 1.5em;
        }
        #outer {
            box-sizing: border-box;
            border-right-style: solid;
            border-left-style: solid;
            clear:both;
            padding-top: 0px;
            width: 80%;
            margin: 0 auto;
            margin-top: 0;
            text-align: center;
            overflow: auto;
        }

        #inner {
            box-sizing: border-box;
            width: 100%;
            float: left;
            padding: 0;
            background-color: #fff;
            font-family: Open Sans,Arial,sans-serif;
            font-size: 14px;font-weight: normal;
            line-height: 2.0em;
            color: #323330;
            margin-top: 0;
            text-align: center;
        }
        /*a {
            color: #FFBA08;
        }*/

    </style>                                  
    <title>Email notification</title>
</head>
<body>
    <div id="header">
        <img height="60" width="220" src="" alt="" title="">
    </div>
    <div id="outer">
        <div id="inner">
            <h1> Text 1 </h1>
            <p> Text 2 </p>
            <p> Text 3 </p>
            <p> <a class="btn btn-warning" href="#"> Activation your account </a> <p>
            <p> Tetxt 5 </p>
        </div>
        <div style="clear: both;"></div>
    </div>
    <div id="footer">
        Text 5
    </div>
</body>

如何在这样的gmail中制作css和html？

0 个答案: