我页面顶部的顶部空间来自哪里?

时间:2013-09-17 04:05:10

标签: css

在此页面中:http://readtypechinese.com/

有一些上限。身体没有任何margin.padding。 html元素也不是。我检查了其他元素,但似乎没有产生它。

可能是什么原因?

相关HTML:

<body class="home page page-id-189 page-template page-template-nonlogin-php single-author singular two-column right-sidebar">


  <div id="header">
    <div class="container">
      <h1 class="logo"><a href="http://readtypechinese.com/" title="Read and Type Chinese Online" rel="home">Read and Type Chinese Online</a></h1>
      <ul class="navigation">
        <li>

相关主管部分:

<!DOCTYPE html>
<!--[if IE 6]>
<html id="ie6" dir="ltr" lang="en-US" xmlns:og="http://opengraphprotocol.org/schema/">
<![endif]-->
<!--[if IE 7]>
<html id="ie7" dir="ltr" lang="en-US" xmlns:og="http://opengraphprotocol.org/schema/">
<![endif]-->
<!--[if IE 8]>
<html id="ie8" dir="ltr" lang="en-US" xmlns:og="http://opengraphprotocol.org/schema/">
<![endif]-->
<!--[if !(IE 6) | !(IE 7) | !(IE 8)  ]><!-->
<html dir="ltr" lang="en-US" xmlns:og="http://opengraphprotocol.org/schema/" xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb#">
<!--<![endif]-->
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width" />
  <meta name="description" content="Lessons and tools that will help you learn how to read and type in Chinese." />
  <meta name="keywords" content="learn, read, type, chinese, mandarin, characters, hanzi, radicals" />
  <ui:composition xmlns="http://www.w3.org/1999/xhtml"
      xmlns:fb="http://www.facebook.com/2008/fbml"
      xmlns:f="http://java.sun.com/jsf/core">
  <meta content='width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no' name='viewport'>
  <title>Learn how to Read and Type in Chinese</title>
  <link rel="icon" type="image/png" href="http://readtypechinese.com/wp-content/themes/twentyeleven/favicon.ico">
  <link rel="profile" href="http://gmpg.org/xfn/11" />
  <link rel="pingback" href="http://readtypechinese.com/xmlrpc.php" />
  <link rel="stylesheet" type="text/css" media="all" href="http://readtypechinese.com/wp-content/themes/twentyeleven/style.css" />

相关CSS:

/* =Global
----------------------------------------------- */

.container {
  margin: 0 auto;
  overflow: hidden;
  width: 960px;
}

/* =Structure
----------------------------------------------- */

#header h1,
#header-fixed h1,
#header-mobile h1,
.button,
.large-bg h3,
.content-front.content-front-right img,
.content-front.content-front-left .details {
  margin-left: 15px;
}

.zopim {
  display: none;
}

/* =Header
----------------------------------------------- */
#header-mobile {
  display: none;
}

#header {
  background: #FFF;
  border-bottom: 1px solid #111; 
  height: 98px;
  -webkit-box-shadow: rgba(0,0,0,0.3) 0 0 4px;
  -moz-box-shadow: rgba(0,0,0,0.3) 0 0 4px;
  box-shadow: rgba(0,0,0,0.3) 0 0 4px;
}

#header h1 {
  background: url(images/logo.png) no-repeat 0 0;
  float: left;
  margin: 0 60px 0 0;
  text-indent: -9999px;
  width: 159px;
  height: 85px;
}

#header h1 a {
  float: left;
  width: 159px;
  height: 85px;
}

#header .tagline {
  color: #FFF;
  float: left;
  font-size: 24px;
  font-family: Aller Regular, sans-serif;
  font-weight: normal;
  letter-spacing: -1px;
  margin: 38px 0 0;
  text-shadow: rgba(0,0,0,1) 0 -2px 0;
}

#header-fixed {
  background: #FFF;
  border-bottom: 1px solid #111;
  position: fixed;
  top: -70px;
  width: 100%;
  z-index: 1000;
  -webkit-box-shadow: rgba(0,0,0,0.3) 0 0 4px;
  -moz-box-shadow: rgba(0,0,0,0.3) 0 0 4px;
  box-shadow: rgba(0,0,0,0.3) 0 0 4px;
}

#header-fixed .tagline {
  color: #FFF;
  float: left;
  font-size: 22px;
  font-family: Aller Regular, sans-serif;
  font-weight: normal;
  letter-spacing: -1px;
  margin: 24px 0 0;
  text-shadow: rgba(0,0,0,1) 0 -2px 0;
}

#header .navigation {
  float: right;
  font-size: 12px;
  margin: 22px 0 0;
  text-align: center;
  width: 302px;
}

#header .navigation li {
  float: left;
}

#header .navigation li a {
  border-right: 1px solid #BBB;
  color: #BBB;
  float: left;
  padding: 0 20px;
  width: 60px;
  text-shadow: rgba(0,0,0,1) 0 -1px 0;
}

#header .navigation li a.contact {
  border-width: 0;
  color: #FFF;
}

#header .navigation li a:hover {
  color: #dd3921;
  text-decoration: none;
}

#header .navigation li a img {
  margin: 0 0 2px;
}

#header .navigation li a span {
  width: 20px;
}

2 个答案:

答案 0 :(得分:3)

它来自http://readtypechinese.com/wp-content/themes/twentyeleven/style.css的第836行 - .large-bg-1的高度为294像素。

截屏:


在删除第836行之前

enter image description here


删除第836行后

enter image description here


答案 1 :(得分:2)

它来自您的代码http://d.pr/i/bWlo生成的“空格”,如果您对其进行编码,则会看到它是%0a(换行符)。

删除它会删除空格http://d.pr/i/zqea

但是,我不确定您使用什么来生成源代码,因为您没有提供任何相关信息。