【发布时间】：2018-09-25 02:10:01
【问题描述】：
我正在使用引导框架在我的系统上进行布局。我想这样安排页面的布局（见下图）
但我面临着挑战。我的代码显示了这一点（见下图） 我需要将登录论坛部分转到右侧，就像我上传的第一张图片一样。
这是我的代码
<?php if($topics) : ?>
<p id="topics">
<div class="row">
<?php foreach ($topics as $topic) : ?>
<p class="topic">
<div class="row">
<div class="col">
</div>
<div class="col-md-5">
<div class="topic-content pull-right">
<h3><a href="topic.php?id=<?php echo $topic['id']; ?>"><?php echo $topic['title']; ?></a></h3>
<div class="topic-info">
<a href="topics.php?category=<?php echo urlFormat($topic['category_id']); ?>"><?php echo $topic['name']; ?></a> >>
<a href="topics.php?user=<?php echo urlFormat($topic['user_id']); ?>"><?php echo $topic['username']; ?></a> >>
Posted on: <?php echo formatDate($topic['create_date']); ?>
<span class="badge pull-right"><?php echo replyCount($topic['id']); ?></span>
</div>
</div>
</div>
</div>
</p>
<?php endforeach; ?>
</p>
<?php else : ?>
<p>No Topics to Display.</p>
<?php endif; ?>
<div class="col-md-4" align="pull-right">
<div class="sidebar">
<div class="block">
<h3>Login Form</h3>
<?php if(isLoggedIn()) : ?>
<div class="userdata">
Logged in as <?php echo getUser()['username']; ?>
</div>
<br />
<form role="form" method="post" action="logout.php">
<input type="submit" name="do_logout" class="btn btn-default" value="Log Out" />
<hr>
<h4><a href="/prac/forum">All Topics</a></h4>
<h4><a href="create.php">Create Topic</a></h4>
</form>
<?php else : ?>
<form role="form" method="post" action="login.php">
<div class="form-group">
<label>Username</label>
<input name="username" type="text" class="form-control" placeholder="Enter Username" />
</div>
<div class="form-group">
<label>Password</label>
<input name="password" type="password" class="form-control" placeholder="password" />
</div>
<button name="do_login" type="submit" class="btn btn-primary">Login</button> <a class="btn btn-default" href="register.php">Create Account</a>
</form>
<?php endif; ?>
</div>
<div class="block">
<h3>Categories</h3>
<div class="list-group">
<a href="topics.php" class="list-group-item <?php echo is_active(null); ?>">All topics <span class="badge pull-right"><?php echo totalPostCount() ;?></span></a>
<?php foreach(getCategories() as $category) : ?>
<a href="topics.php?category=<?php echo $category['id']; ?>" class="list-group-item <?php echo is_active($category['id']); ?>">
<?php echo $category['name']; ?>
<span class="badge pull-right">
<?php echo postCountByCategory($category['id']) ;?>
</span>
</a>
<?php endforeach; ?>
</div>
</div>
</div>
</div>
</div>
<hr>
<h3>Forum Statistics</h3>
<p>
<h6>Total Number of Users: <strong><?php echo $totalUsers; ?></strong></li>
<h6>Total Number of Topics: <strong><?php echo $totalTopics; ?></strong></li>
<h6>Total Number of Categories: <strong><?php echo $totalCategories; ?></strong></li>
</ul>【问题讨论】：
-
pull-right不是align属性的有效值。您是想将其添加到课程列表中吗？ -
使用正确的应答器，如
<section></section>或<div><div/>作为主要元素（不是<p></p>，它仅用于段落），无需使用<br>进入下一行：HTML带有display:block;的元素会将所有车道视为正常行为。并阅读一些引导教程以了解网格的工作原理:) -
是的，请看我附上的图片
-
@Rayobeats 看起来您正在学习并尝试复制下面的页面，如果您只是复制/粘贴代码，您将学到什么？尝试使用逻辑逐步完成：我可以看到多少块？ （页眉？页脚？侧边菜单？多少部分？..）我的元素如何在响应式上工作？使我的元素变为蓝色和下划线的 css 属性是什么？粗体字？等等
标签： php html css twitter-bootstrap