html - 我的 heading3 左侧和右侧的图像-6ren

html - 我的 heading3 左侧和右侧的图像

转载作者：行者123 更新时间：2023-11-28 09:42:53

25

4

我想在 header3 的两边放置图像我希望它看起来像这样 http://bsmithpci.accountsupport.com/buccs-sched.jpg .这是我想要的标志图片http://bsmithpci.accountsupport.com/firelogo.jpg

<!DOCTYPE html>
 <html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=UTF-8">
 <title>Tampa Bay Buccaneers Fan Page</title>
 <meta name="author" content="Ben Smith">
 <meta name="description" content="introduction to HTML">
 <meta name="keywords" content="html, eclasses, website builder">
 <link href='http://fonts.googleapis.com/css?family=Pirata+One'
    rel='stylesheet' type='text/css' >
  <link rel="stylesheet" type="text/css" href="/final5.css">
</head>
<body>


  <p id="text" class="Three-Dee">Tampa Bay Buccaneers Fan Page</p>
  <br><br><br><br><br>

   <div class="file">
   <ul>
            <li>                   

     <a href="http://bsmithpci.accountsupport.com/final1.html"> 
                Home</a></li>
    <li><a href="http://bsmithpci.accountsupport.com/final2.html">
      Image Gallery</a></li>
    <li>
    <a href="http://bsmithpci.accountsupport.com/final3.html">Schedule</a>
    </li>
            <li><a href="http://bsmithpci.accountsupport.com/final5.html">
     Fan Club</a></li>
            <li><a href="http://bsmithpci.accountsupport.com/final4.html">
      Contact Us</a></li>
 </ul>
 </div>


<h1>Buccaneers Fan Club</h1><br><br><br>


  <h3>Buccaneer's 2014 Schedule</h3><br><br>

  <table id="Schedule">
    <tr>
      <th>Week</th>
       <th>Date</th>
       <th>Opponent</th>
       <th>Time(ET)</th>
     </tr>
    <tr class="alt">
     <td>1</td>
     <td>Sun, Sep 7</td>
      <td>Carolina</td>
      <td>1:00 PM</td>
    </tr>
   <tr>
    <td>2</td>
     <td>Sun, Sep 14</td>
      <td>St. Louis</td>
      <td>1:00 PM</td>
   </tr>
     <tr class="alt">
       <td>3</td>
      <td>Thu, Sep 18</td>
      <td>at Atlanta</td>
      <td>1:00 PM</td>
   </tr>
   <tr>
     <td>4</td>
     <td>Sun, Sep 28</td>
     <td>at Pittsburgh</td>
    td>1:00 PM</td>
   </tr>
   <tr class="alt">
    <td>5</td>
    <td>Sun, Oct 5</td>
   <td>at New Orleans</td>
    <td>1:00 PM</td>
   </tr>
  <tr>
    <td>6</td>
   <td>Sun, Oct 12</td>
    <td>Baltimore</td>
    <td>1:00 PM</td>
   </tr>
    <tr class="alt">
    <td>7</td>
    <td>*Bye</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
   </tr>
  <tr>
   <td>8</td>
    <td>Sun, Oct 26</td>
    <td>Minnesota</td>
    <td>1:00 PM</td>
  </tr>
    <tr class="alt">
    <td>9</td>
    <td>Sun, Nov 2</td>
    <td>at Cleveland</td>
   <td>1:00 PM</td>
   </tr>
    <tr>
     <td>10</td>
     <td>Sun, Nov 9</td>
     <td>Atlanta</td>
     <td>1:00 PM</td>
   </tr>
     <tr class="alt">
      <td>11</td>
     <td>Sun, Nov 16</td>
     <td>at Washington</td>
    <td>1:00 PM</td>
  </tr>
  <tr>
    <td>12</td>
    <td>Sun, Nov 23</td>
    <td>at Chicago</td>
    <td>1:00 PM</td>
  </tr>
   <tr class="alt">
    <td>13</td>
    <td>Sun, Nov 30</td>
    <td>Cincinnati</td>
    <td>1:00 PM</td>
   </tr>
  <tr>
   <td>14</td>
   <td>Sun, Dec 7</td>
   <td>at Detroit</td>
   <td>1:00 PM</td>
  </tr>
  <tr class="alt">
    <td>15</td>
    <td>Sun, Dec 14</td>
    <td>at Carolina</td>
   <td>1:00 PM</td>
  </tr>
  <tr>
    <td>16</td>
   <td>Sun, Dec 21</td>
    <td>Green Bay</td>
    <td>1:00 PM</td>
 </tr>
 <tr class="alt">
   <td>17</td>
   <td>Sun, Dec 28</td>
   <td>New Orleans</td>
    <td>1:00 PM</td>
  </tr>

</table>




 </body>
 </html>

最佳答案

您可以 float 您的图像分别到左边和右边。

<div id="container">
    <img id="one" src="http://bsmithpci.accountsupport.com/firelogo.jpg"/>
    <p id="text" class="Three-Dee">Tampa Bay Buccaneers Fan Page</p>
    <img id="two" src="http://bsmithpci.accountsupport.com/firelogo.jpg"/>
</div>

CSS:

img {
    height:30px;
}

#container{
    width:100%;
}

#one {
    float:left;
}

#two{
    float:right;
}

.Three-Dee{
    display:inline-block;
    text-align:center;
    width:80%;
    margin:auto;
}

示例:http://jsfiddle.net/cj2cc2nx/

关于html - 我的 heading3 左侧和右侧的图像，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25352178/

25

4

0

文章推荐： html - 对话框内 div 的滚动问题

文章推荐： javascript - jQuery 可读性 : insert table inside

element

文章推荐： css - box-sizing: border-box 没有声明高度/宽度

文章推荐： css - svg 文本上的线性渐变问题

git - HEAD、HEAD^ 和 HEAD~1 有什么区别？
在git中，以下有什么区别？头头^ HEAD~1 HEAD~2 它们与 master 有什么关系？那么有没有MASTER^, MASTER~1?? 最佳答案 HEAD 是当前分支上最新提交的同义词
java - head=head.getNext() 和 head=current.getNext() 有什么区别？
我想实现一个 LinkedListremove 方法，该方法可以删除任何特定位置的项目，但在本例中，我最感兴趣的是删除列表开头(第 0 个位置)的项目。我的代码适用于 n 大于零的值，因此我为 n=
html - 中标签的顺序
的顺序有什么关系吗？或或标签位于中？ (愚蠢的问题，但其中一件事我直到现在才考虑过。) 最佳答案优化据 Yahoo! 的人说你应该put CSS at the top和 scripts
git - HEAD~ vs HEAD^ vs HEAD@{} 也称为代字号 vs 插入符号 vs 符号
HEAD 是指向当前分支的指针。我见过 HEAD 祖先的各种符号，包括 HEAD~2 HEAD^2 HEAD@{2} 头~~ 头^^ 以上每一项到底是什么意思？这方面的文件在哪里？最佳答案来自文档
git - 黑白 'git diff HEAD' 和 'git diff HEAD HEAD~1' 有什么区别？
我对 git 很陌生，任何人都可以帮助我。我实际上被困在什么是“git diff HEAD”。 “git diff HEAD”和“git diff HEAD HEAD~1”有什么区别最佳答案 gi
head - 使用 libgit2 获取远程 HEAD？
我似乎不知道如何获得 git_reference *到特定 Remote 的 HEAD。我有: git_repository * repo = NULL; git_reference * ref
javascript - JavaScript 中的哪个对象包含 ".."？
关于 firefox浏览器控制台，我可以访问容器如下所示。 > window [object Window] > documentObject = window["document"
c# - 如何在页面中动态添加脚本
我使用 asp.net 4 和 c#。我在 Web From 页面中有一个 Web 用户控件。当我包含 Web 用户控件时，我还想以编程方式在最终生成的页面的标记中包含一些脚本。知道怎么做吗？也许
PHP - 将数据作为包含加载是否愚蠢
这可能是一个非常愚蠢的问题，但是加载文件中标签之间的数据并通过 PHP include() 加载它是愚蠢的吗？这样就可以更轻松地进行编辑。谢谢。最佳答案不，这不会是愚蠢的。代码重复越少越好。关于
html - 一个或多个资源的目标为 'head' ，但没有 'head
我编写了以下 facelet index.xhtml: 当我从浏览器获取
c - 到 "head"还是不到 "head"？
我有一个不断递增的“指针”，我需要最终返回指针的“头”。我进退两难，要么使用“pointer[0]”，要么使用另一个名为“head”的变量并初始化它并在最后返回。我觉得前者使代码看起来很脏，后来占用的
git - HEAD :master and HEAD?有什么区别
git push https://heroku:$HEROKU_API_KEY@git.heroku.com/$HEROKU_APP_NAME_PRODUCTION.git HEAD 和 git pu
git - 如何使带有分离 HEAD 的子模块附加到实际 HEAD？
当我像这样将 Git 子模块添加到 Git 存储库时， git submodule add ssh://server/proj1/ proj1 git submodule init git submo
git - 在不丢失 HEAD 的情况下将 HEAD 分配给之前的提交
我的本地存储库中有一个我不打算推送的提交(A)。现在，HEAD 在 A 处。假设我想在提交 (A) 之上创建另一个提交 (B) NOT，但在前一个提交之上而不是提交 (A)。如何在不丢失最新
javascript - Head.js head.load 的多次调用
多次调用 head.load 是否同步？我的意思是，如果我们有这样的代码: head.load('scr1.js',...,'scr8.js'); head.load('scr11.js',...,
mysql - 'headings.heading' 中的未知列 'field list'
执行以下查询时出现以下错误: #1054 - Unknown column 'headings.heading' in 'field list' 标题表中肯定有一个名为“标题”的列。当我测试它时，问题
git diff HEAD^ HEAD 什么都不显示
我试图显示上次提交与之前提交之间的差异: git diff HEAD^ HEAD 但是什么都不显示。事实上，我知道这两个提交之间存在差异。我做错了什么，我应该如何改正？ P.S.:我觉得这个问题以
git:可靠地切换到分离的 HEAD，然后稍后恢复 HEAD，全部来自脚本
这就是场景。我有一个运行一些测试的脚本。我需要制作另一个接受 git 提交名称作为参数的脚本，然后执行以下操作: 保存当前提交状态 - 分支名称或未命名提交。在指定提交时切换到分离的 HEAD 针对
git - git diff HEAD^ HEAD 的写法是否更短？
我发现自己经常输入这个，比如当我做了一些改变，提交它，然后要么需要查找我在那里做的事情来弄清楚下一步该做什么，要么确保我没有添加任何意外的东西在将其推送到远程之前提交。无可否认，diff HEAD^
Git - head(小写)与 HEAD(大写)
我是否理解正确，Git head(小写)和 Git HEAD(大写)的区别在于前者是结束提交，后者只是当前提交(无论是最终提交还是非最终提交被选为 HEAD 提交)？编辑:“结束提交”是指“给定分支

首页

博学

6Ren·AI

商城

html - 我的 heading3 左侧和右侧的图像