我想在右上角添加一个配置文件图标,该图标应该有“我的帐户”和“注销”选项,如图所示。请告诉我如何将其添加到下面的代码中。
<style type="text/css">
ul {
margin: 0;
padding: 0;
}
li {
list-style-type: none;
}
#nav {
display: table;
table-layout: fixed;
text-align: center;
}
#nav li {
display: table-cell;
width: 25%;
padding-right: 1px;
height: auto;
vertical-align: bottom;
}
#nav a {
display: block;
min-height: 100%;
padding: 12px 50px;
background-color: #222;
color: white;
border-radius: 6px 6px 0 0;
}
.logoutLblPos{
position:fixed;
right:10px;
top:5px;
}
</style>
<body>
<div class="container">
<div class="row">
<div class="col-sm-5 col-sm-push-3 col-xs-4 col-xs-push-2">
<h1 class="text-center" style="font-family:Colonna MT;font-size:50px;color:ForestGreen ;">Welcome</h1>
<p class="lead text-center" style="font-size:20px;color:DarkSalmon;"><i>"This is caption"</i></p>
<label class="logoutLblPos">
<span class="glyphicon glyphicon-user" style="height:50px;width:20px"></span> User
<input name="submit2" type="submit" id="submit2" value="log out">
</label>
<ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#"> tab2</a></li>
<li><a href="#">tab3</a></li>
<li><a href="#">tab4</a></li>
</ul>
</div>
</div>
</div>
</div>
此外,我需要在个人资料图标旁边添加“发布您的广告”。
最佳答案
请看例子fiddle
HTML
<div style="background:color:#fff; border:solid 1px #333; float:left; text-align:center; padding:5px;">
<i class="fa fa-user"></i><br>
User
</div>
关于html - 如何在屏幕右上角添加个人资料图标?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35843030/