无法操作div我想要什么

问题描述：

如何让文本保持在我网站上的正确位置并将div均匀地包裹在它的周围？无法操作div我想要什么

我不知道如何做到这一点。现在，div占据了页面的整个宽度，我想将它的一部分剪掉，以使它看起来平坦。我想操纵“pageTwoblock”类的div。

HTML：

<!DOCTYPE html> 
<html> 
<head> 
    <title>Daniel's Portfolio | Welcome</title> 
    <link rel="stylesheet" href="CSS/bootstrap.min.css"> 
    <link rel="stylesheet" href="CSS/style.css"> 
    <link href="https://fonts.googleapis.com/css?family=Orbitron" rel="stylesheet"> 
</head> 
<body> 
    <div class="pageOne text-center"> 
     <ul class = "nav nav-pills"> 
      <li> 
       <a href="#">Daniel Collins</a> 
      </li> 
      <li class="pull-right"> 
       <a href="#">Contact Me</a> 
      </li> 
      <li class="pull-right"> 
       <a href="#">Portfolio</a> 
      </li> 
      <li class="pull-right"> 
       <a href="#">About Me</a> 
      </li> 
     </ul> 
     <div class="block text-center"> 
      <h1>Daniel's Portfolio Website</h1> 
      <h2>Various Projects</h2> 
     </div> 
     <div class = "btnList text-center"> 
      <a class = "btn btn-default" href="#">Reddit</a> 
      <a class = "btn btn-default" href="#">GitHub</a> 
      <a class = "btn btn-default" href="#">Linkedin</a> 
      <a class = "btn btn-default" href="#">Facebook</a> 
     </div> 
    </div> 
    <div class= "pageTwo"> 
     <div class= "pageTwoblock"> 
      <div class="row"> 
       <div class ="col-md-6 text-center"> 
        <h1>Daniel Collins</h1> 
        <p> 
         I’m a web developer and designer living in Jacksonville, Florida, United States. I spend my days with my hands in many 
         different areas of web development from back end programming (PHP, C#, Java) to front end engineering 
         (HTML, CSS, and jQuery/Javascript), digital accessibility, user experience and visual design. 
        </p> 
       </div> 
      </div> 
      <div class ="col-md-6"> 
      </div> 
     </div> 
    </div> 
</body> 
</html>

CSS：

body{ 
    background-color: white; 
    font-family:Orbitron; 
    color:white; 
} 

.block{ 
    background-color: #337ab7; 
    opacity: .7; 
    padding:10px; 
    width:50%; 
    margin-right: auto; 
    margin-left: auto; 
    border-radius:5px; 
} 

.nav-pills{ 
    font-size: 1.7em; 
    background-color: none; 
    margin-bottom: 10% 
} 

h1{ 
    padding:0; 
    margin-top: 0px; 
    font-size: 5.0em; 
} 

.btn-default{ 
    font-size:1.7em; 
    color:#337ab7; 
} 

.pageOne{ 
    background: url("../images/mountains.jpg"); 
    background-repeat: none; 
    background-size: cover; 
    display: inline-block; 
    height: 1000px; 
    width: 100%; 
} 

.pageTwo{ 
    background: url("../images/darkmountains.jpg"); 
    background-repeat: none; 
    background-size: cover; 
    display: inline-block; 
    height: 1000px; 
    width: 100%; 
    background-size: cover; 
    padding-top:5%; 
} 

.pageTwoblock{ 
    background-color: #337ab7; 
    opacity: .7; 
    padding:10px; 
    border-radius:5px; 
} 

p{ 
    font-size: 2.5em; 
}

Link to webpage

你试过哪个div修改？ –

与类pageTwoblock – Daniel

答

快速的解决办法是添加类 “COL-MD-6” 带班 “pageTwoblock”

到的div

<div class="col-md-6 pageTwoblock">

的DIV我想你的建议，但仍然有多余的空间，它是不是均匀分布的 http://imgur.com/a/BjxxO – Daniel

所以现在只是删除“COL-MD-6 “来自 –

非常感谢！ – Daniel

无法操作div我想要什么

相关推荐