改变水平规则的线高

Question

我已经在互联网上关注了一个教程，我有以下html模板：

position:absolute; left: 0; right: 0; top: 0; bottom: 0;

body {
  font-weight: 200;
  font-size: 14px;
}

.header {
  font-size: 20px;
  font-weight: 100;
  text-align: center;
  color: #007cae;
}

.title {
  font-size: 22px;
  font-weight: 100;
  /* text-align: right;*/
  padding: 10px 20px 0px 20px;  
}

.title span {
  color: #007cae;
}

.details {
  padding: 10px 20px 0px 20px;
  text-align: left !important;
  /*margin-left: 40%;*/
}

.hrItem {
  border: none;
  height: 1px;
  /* Set the hr color */
  color: #333; /* old IE */
  background-color: #fff; /* Modern Browsers */
 }

我遇到的问题是Invoice＃和水平规则之间存在大量我要删除的空白区域。我尝试更改 <div class='wrapper'> <div class='header'> <p class='title'>Invoice #<hr class='hrItem' /> </p> </div> <div> <div class='details'> Bill to: <br/> Amount: <br/> Date: </div> </div>，.hrItem和.tittle中的填充和边距，但这没有任何区别。是否可以删除该空格，还是应该重新考虑添加水平线的方法？

Answer 1

您需要将<p>置于<p></p>之外，因为其中包含无效的HTML并且实际上最终会创建一个空的<div class='header'> <p class='title'>Invoice #</p> <hr class='hrItem' /> </div> ，这会创建更多空间：

你应该拥有的是：

.hrItem

进行更改后，您可以通过更改.title属性（我将两者设置为margin）来控制0和body { font-weight: 200; font-size: 14px; } .header { font-size: 20px; font-weight: 100; text-align: center; color: #007cae; } .title { font-size: 22px; font-weight: 100; /* text-align: right;*/ padding: 10px 20px 0px 20px; margin: 0; } .title span { color: #007cae; } .details { padding: 10px 20px 0px 20px; text-align: left !important; /*margin-left: 40%;*/ } .hrItem { border: none; height: 1px; /* Set the hr color */ color: #333; /* old IE */ background-color: #fff; /* Modern Browsers */ margin: 0; }之间的间距：< / p>

<div class='wrapper'>
  <div class='header'>
    <p class='title'>Invoice #</p>
    <hr class='hrItem' /> 
  </div>
         
  <div class='details'>
    Bill to: <br/>
    Amount:  <br/>
    Date: 
  </div>
</div>

from bson import ObjectId
import datetime


def replace_ids(obj, new_ids=None):
  if new_ids is None:
    new_ids = {}
  if isinstance(obj, dict):
    return {key: replace_ids(value, new_ids) for key, value in obj.items()}
  if isinstance(obj, list):
    return [replace_ids(item, new_ids) for item in obj]
  if isinstance(obj, str):
    if obj not in new_ids:
      new_ids[obj] = generate_new_id(obj)
    return new_ids[obj]
  if isinstance(obj, ObjectId):
    return ObjectId()
  return obj


def generate_new_id(obj):
  if is_valid_objectid(obj):
      return str(ObjectId())
  return obj


def is_valid_objectid(objid):
  if not objid:
      return False
  obj = ObjectId()
  return obj.is_valid(objid)


a = {'_id':ObjectId('5a37844dcf2391c87fb4f845'),
     'a':'5a37844dcf2391c87fb4f844',
     'b':[{'a':'5a37844dcf2391c87fb4f844', 'b':'ABCDEFGH'},{'a':'5a37844dcf2391c87fb4f846', 'b':'abc123456789111111'}],
     'c':['5a37844dcf2391c87fb4f846','5a37844dcf2391c87fb4f844','5a37844dcf2391c87fb4f847'],
     'd':datetime.datetime(2017,11,1,0,0)
    }

b = replace_ids(a)
print(b)