Question

我在我的WordPress网站上有一个MailChimp optin的代码，但由于某种原因，边框突然消失了，你能不能看看我可能缺少什么？

<div style="border-style: solid thin #FFFFFF">
  <p style="float:left; padding: 0px 5px 0px 0px;"><img src="http://www.xxxx.com/wp-content/uploads/2017/06/photo.jpg" style="width:115px; height:auto;" class="border"></p>
  <p><text 
  </p> 
  &nbsp;

  <!-- Begin MailChimp Signup Form -->
  <link href="//cdn-images.mailchimp.com/embedcode/horizontal-slim-10_7.css" rel="stylesheet" type="text/css">
  <style type="text/css">
    #mc_embed_signup{background:#FFFFFF; clear:left; font:14px Helvetica,Arial,sans-serif; width:100%;}
    /* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
    We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
  </style>
  <div id="mc_embed_signup">
    <form action="//xxxxxxx.us14.list-manage.com/subscribe/post?u=2b24d9a7eb0e64eed113ca92c&amp;id=6444b29c17" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
      <div id="mc_embed_signup_scroll">
        <label for="mce-EMAIL">Subscribe to our mailing list</label>
        <input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
        <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
        <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_2b24d9a7eb0e64eed113ca92c_6444b29c17" tabindex="-1" value=""></div>
        <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
      </div>
    </form>
  </div>

Answer 1

边框样式不接受颜色，也不接受＆＃34;薄＆＃34;作为一种价值。

你想使用＆＃34; border＆＃34;在您尝试的上下文中：

<div style="border: solid thin #FFFFFF">
  hello
</div>

https://jsfiddle.net/4tm3d1jm/

但是，对于文档中所有div元素应用border（或border：none）的其他样式，可能会覆盖div元素。

参考：https://developer.mozilla.org/en-US/docs/Web/CSS/border-style?v=control

Answer 2

使用：

<div style= 'border: 2px solid #fff'>

而不是你的div

我希望：

#mc_embed_signup{background:#FFFFFF; clear:left; font:14px Helvetica,Arial,sans-serif; width:100%;}

在样式标签之间

<style>#mc_embed_signup{background:#FFFFFF; clear:left; font:14px Helvetica,Arial,sans-serif; width:100%;}</style>

如果没有，它就不会工作。样式必须应用于css文件或标记之间。另外，我想让你记住css层次结构（CSS Selector Hierarchy?）

使用div样式无法进行边框显示

2 个答案: