我的导航栏品牌存在一个问题,我将徽标与img-responsive相对应,但它不适合以下屏幕截图和代码。 如果我改变宽度和高度,那么图像完成的响应。和内容重叠。
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.php"><img src="logo.jpg" class="img-responsive" alt="Responsive image"></a>
</div>
</div>
<div class="container">
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#"> ABOUT AIE <span class="caret"> </span> </a>
<ul class="dropdown-menu" >
<li class="size"> <a href="index.php"> Home</a> </li>
<li class="divider"> </li>
<li class="size"> <a href="vision_mission.php"> Vision & Mission </a> </li>
<li class="divider"> </li>
<li class="size"> <a href="#"> History </a> </li>
<li class="divider"> </li>
<li class="size"> <a href="chairman.php"> Chairman's Message </a> </li>
<li class="divider"> </li>
<li class="size"> <a href="rector.php">Rector's Message </a></li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#"> ADMISSIONS <span class="caret"> </span> </a>
<ul class="dropdown-menu">
<li class="size"> <a href="inter.php"> Intermediate </a> </li>
<li class="divider"> </li>
<li class="size"> <a href="admissions.php"> Undergaduate </a> </li>
<li class="divider"> </li>
<li class="size"> <a href="admissions.php"> Graduate </a> </li>
<li class="divider"> </li>
<li class="size"> <a href="admissions.php"> Diploma Programs </a> </li>
</ul>
</li>
<li class="dropdown" ><a class="dropdown-toggle" data-toggle="dropdown" href="#"> RESOURCES <span class="caret"> </span> </a>
<ul class="dropdown-menu">
<li class="size"> <a href="qec_1.php"> QEC Vision & Mission</a>
<li role="presentation" class="divider"> </li>
<li class="size"> <a href="qec_2.php"> QEC Programme Teams </a>
<li role="presentation" class="divider"> </li>
<li class="size"> <a href="library.php"> Library </a> </li>
</ul>
</li>
<li class="dropdown" ><a class="dropdown-toggle" data-toggle="dropdown" href="#"> SHORT COURSES <span class="caret"> </span> </a>
<ul class="dropdown-menu">
<li class="size"> <a href="eldcshort.php"> English Language Development Centre Short Courses (ELDC) </a> </li>
<li role="presentation" class="divider"> </li>
<li class="size"> <a href="montessori.php"> Montessori </a> </li>
</ul>
</li>
<li class="dropdown" ><a class="dropdown-toggle" data-toggle="dropdown" href="#"> OTHER DEPARTMENTS <span class="caret"> </span> </a>
<ul class="dropdown-menu">
<li class="size"> <a href="about_cpdc.php"> Continuing Professional Development (CPD) </a> </li>
<li role="presentation" class="divider"> </li>
<li class="size"> <a href="kids.php"> Kids University </a> </li>
<li role="presentation" class="divider"> </li>
<li class="size"> <a href="nbtcw.php"> Need Based Training </a> </li>
<li role="presentation" class="divider"> </li>
<li class="size"> <a href="leadership_and_management.php"> Leadership & Management </a> </li>
</ul>
</li>
<li class="dropdown" ><a class="dropdown-toggle" data-toggle="dropdown" href="#"> CAMPUS VIEW <span class="caret"> </span> </a>
<ul class="dropdown-menu">
<li class="size"> <a href="#"> 3D Campus View </a> </li>
</ul>
</li>
<li class="dropdown" ><a class="dropdown-toggle" data-toggle="dropdown" href="#"> CONTACT US <span class="caret"> </span> </a>
<ul class="dropdown-menu">
<li class="size"> <a href="contact.php"> Location </a> </li>
</ul>
</li>
</div>
</nav>
</div>
并且css文件是这个
body { padding-top: 40px; }
@media screen and (max-width: 768px) {
body { padding-top: 0px; }
}
.navbar-default
{
background-color: #002E5F;
}
内容重叠,即使我没有改变高度和宽度
答案 0 :(得分:2)
这是你的答案
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
.navbar-default
{
background-color: #002E5F;
}
</style>
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
</div>
<div class="container">
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="index.php"><img src="https://www.google.co.in/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" class="img-responsive" alt="Responsive image"></a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#"> ABOUT AIE <span class="caret"> </span> </a>
<ul class="dropdown-menu" >
<li class="size"> <a href="index.php"> Home</a> </li>
<li class="divider"> </li>
<li class="size"> <a href="vision_mission.php"> Vision & Mission </a> </li>
<li class="divider"> </li>
<li class="size"> <a href="#"> History </a> </li>
<li class="divider"> </li>
<li class="size"> <a href="chairman.php"> Chairman's Message </a> </li>
<li class="divider"> </li>
<li class="size"> <a href="rector.php">Rector's Message </a></li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#"> ADMISSIONS <span class="caret"> </span> </a>
<ul class="dropdown-menu">
<li class="size"> <a href="inter.php"> Intermediate </a> </li>
<li class="divider"> </li>
<li class="size"> <a href="admissions.php"> Undergaduate </a> </li>
<li class="divider"> </li>
<li class="size"> <a href="admissions.php"> Graduate </a> </li>
<li class="divider"> </li>
<li class="size"> <a href="admissions.php"> Diploma Programs </a> </li>
</ul>
</li>
<li class="dropdown" ><a class="dropdown-toggle" data-toggle="dropdown" href="#"> RESOURCES <span class="caret"> </span> </a>
<ul class="dropdown-menu">
<li class="size"> <a href="qec_1.php"> QEC Vision & Mission</a>
<li role="presentation" class="divider"> </li>
<li class="size"> <a href="qec_2.php"> QEC Programme Teams </a>
<li role="presentation" class="divider"> </li>
<li class="size"> <a href="library.php"> Library </a> </li>
</ul>
</li>
<li class="dropdown" ><a class="dropdown-toggle" data-toggle="dropdown" href="#"> SHORT COURSES <span class="caret"> </span> </a>
<ul class="dropdown-menu">
<li class="size"> <a href="eldcshort.php"> English Language Development Centre Short Courses (ELDC) </a> </li>
<li role="presentation" class="divider"> </li>
<li class="size"> <a href="montessori.php"> Montessori </a> </li>
</ul>
</li>
<li class="dropdown" ><a class="dropdown-toggle" data-toggle="dropdown" href="#"> OTHER DEPARTMENTS <span class="caret"> </span> </a>
<ul class="dropdown-menu">
<li class="size"> <a href="about_cpdc.php"> Continuing Professional Development (CPD) </a> </li>
<li role="presentation" class="divider"> </li>
<li class="size"> <a href="kids.php"> Kids University </a> </li>
<li role="presentation" class="divider"> </li>
<li class="size"> <a href="nbtcw.php"> Need Based Training </a> </li>
<li role="presentation" class="divider"> </li>
<li class="size"> <a href="leadership_and_management.php"> Leadership & Management </a> </li>
</ul>
</li>
<li class="dropdown" ><a class="dropdown-toggle" data-toggle="dropdown" href="#"> CAMPUS VIEW <span class="caret"> </span> </a>
<ul class="dropdown-menu">
<li class="size"> <a href="#"> 3D Campus View </a> </li>
</ul>
</li>
<li class="dropdown" ><a class="dropdown-toggle" data-toggle="dropdown" href="#"> CONTACT US <span class="caret"> </span> </a>
<ul class="dropdown-menu">
<li class="size"> <a href="contact.php"> Location </a> </li>
</ul>
</li>
</div>
</nav>
</div>
</body>
</html>
&#13;
答案 1 :(得分:1)
我相信你想要的东西可以用CSS完成。
mysqli_query("update users set pw='" . $new_password. "' WHERE email='" . $email. "'");
小心,你的标记看起来有点奇怪。有些标签是额外的或缺失的。
的小提琴答案 2 :(得分:1)
您需要为.navbar{
border: none;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
margin-bottom: 0;
height: auto;
}
.navbar-brand{
height: auto;
margin-left: 15px;/* add margin in left. Because padding is removed from left. */
padding: 5px 0; /* Remove padding from left and right. User need to click on logo not outside of logo. */
width: 200px;
}
@media (min-width: 768px){
.navbar-brand{
width: auto; /* You can change the width when you need. */
}
}
类编写自定义CSS。请关注此事。
;WITH cte
AS (SELECT Count(1)OVER(partition BY [Type]) cnt,*
FROM (SELECT DISTINCT [Type],
[Flag],
-- to find the first record when flag is Y
Min([Value])OVER(partition BY [Type]) AS min_val,
-- to find the first records of Flag Y and N for each type
Min([Value])OVER(partition BY [Type], [Flag]) AS min_fl_val
FROM Yourtable) a)
SELECT *
FROM Yourtable a
WHERE EXISTS (SELECT 1
FROM cte b
WHERE a.Type = b.Type
AND ( ( cnt = 1
AND Flag = 'y'
AND b.min_val = a.Value ) -- to find first record of Type when Flag is only Y
OR ( cnt = 1
AND Flag = 'N' ) -- to pull all the record of Type when Flag is only N
OR ( cnt > 1
AND a.Flag = b.Flag
AND a.Value = b.min_fl_val ) )) -- to find first record for each flag in each type