为了账号安全,请及时绑定邮箱和手机立即绑定

使用 Bootstrap 创建带有 3 个图像的横幅标题

使用 Bootstrap 创建带有 3 个图像的横幅标题

PHP
潇潇雨雨 2022-07-22 10:14:11
我正在尝试为我正在为大学项目设计的页面制作标题。我一直在玩不同的代码,我能管理的最好的是 3 张图片,一张在另一张下面。在我的一生中,我无法看到如何使它们彼此相邻,在横幅中,然后适合屏幕的长度。标头代码:    <header>      <div class="container-fluid">       <div class="row">        <div class="col-md-4">            <div class="span4">            <img class="img-responsive" src="https://i.ibb.co/7vJj2z4/logo-small.png" alt="img">        </div>        </div>             <div class="col-md-4">                 <div class="span4">            <img class="img-responsive" src="https://i.ibb.co/Mf8HmH7/Jedi-Mind-Reader-Logo-Small.png" alt="img">        </div>             </div>            <div class="col-md-4">                <div class="span4">            <img class="img-responsive" src="https://i.ibb.co/7vJj2z4/logo-small.png" alt="img">        </div>            </div>    </div></div></div></header>样式代码* {box-sizing: border-box;}body {  margin: 0;  font-family: Orbitron, sans-serif;}.header, .footer {  overflow: hidden;  background-color: black;}.footer {   color: white;}.header {  color: yellow;}.header, .footer a {  float: left;  text-align: center;  text-decoration: none;  font-size: 18px;  line-height: 25px;  border-radius: 4px;}.header, .footer a.logo {  font-size: 25px;  font-weight: bold;}.header, .footer a:hover {  background-color: black;  color: yellow;}.header, .footer a.active {  background-color: black;  color: black;}.header-right, .footer-right {  float: right;}@media screen and (max-width: 500px) {  .header, .footer a {    float: none;    display: block;    text-align: center;  }  .header-right, .footer-right {    float: none;  }}
查看完整描述

1 回答

?
慕妹3146593

TA贡献1820条经验 获得超9个赞

您正在尝试将样式应用于不存在的类。你可以打电话,header {}但如果你使用.header {},那么你需要改变<header>=><header class="header">



查看完整回答
反对 回复 2022-07-22
  • 1 回答
  • 0 关注
  • 123 浏览

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信