第七次随笔

Posted 2020-09-21

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了第七次随笔相关的知识，希望对你有一定的参考价值。

这周用html做了个网页，代码如下：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>The Finals</title>
<link href="configuration/index.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" href = "images/favicon.ico">
<style type="text/css">

a:visited {
text-decoration: none;
}
.白色连接 {
font-family: "黑体";
font-weight: bolder;
color: #FFFFFF;
}
.黑色链接 {
color: #000000;
}
a:link {
text-decoration: none;
}
a:active {
text-decoration: none;
}
a:hover {
color: #0000FF;
font-weight: normal;
}
</style>
</head>

<body style="text-align: center; color: #FFF; font-weight: bold;">
<table width="1200" border="0" align="center" cellspacing="0">
<tr>
    <td><div id="banner"><img src="images/banner.jpg" width="1200" height="280" alt="banner"></div></td>
</tr>
<tr>
    <td><div id="menu">
      <table width="1200" height="40" border="0">
        <tbody>
          <tr>
            <td><div id="navigation">首页</div></td>
            <td><div id="navigation">总决赛详情</div></td>
            <td><div id="navigation">骑士队</div></td>
            <td><div id="navigation">勇士队</div></td>
            <td><div id="navigation">季后赛对阵图</div></td>
            <td><div id="navigation"><a href="http://china.nba.com/" class="白色连接">NBA官网</a></div></td>
          </tr>
        </tbody>
      </table>
    </div></td>
</tr>
<tr>
    <td><table width="200" border="0">
      <tbody>
        <tr>
          <td width="680"><img src="images/finals.jpg" width="680" height="440" /></td>
          <td width="420"><table width="510" border="0">
            <tbody>
              <tr valign="top">
                <td bgcolor="#ECECEC"><div id="newstitle">新闻：</div>
                  <div id="news">
                    <p><a href="http://china.nba.com/a/20170603/020870.htm" class="黑色链接">如何限制勒布朗布朗：我们用阿杜护框</a></p>
                    <p><a href="http://china.nba.com/a/20170603/020309.htm" class="黑色链接">迈克-布朗将从骑士领工资直到2020年</a></p>
                    <p><a href="http://china.nba.com/a/20170603/019683.htm" class="黑色链接">卢指导强调打出对抗性乐福：相信TT会强势反弹</a></p>
                    <p><a href="http://china.nba.com/a/20170603/019700.htm" class="黑色链接">麦克海尔回忆湖凯大战：那是NBA辉煌的开始</a></p>
                    <p> </p>
                  </div></td>
              </tr>
              <tr>
                <td> </td>
              </tr>
            </tbody>
          </table></td>
        </tr>
      </tbody>
    </table></td>
</tr>
<tr>
    <td><div><img src="images/bottom.jpg" width="1200" height="50" /></div></td>
</tr>
</table>
</body>
</html>

还不光用了内部修饰，还用了CSS：

@charset "utf-8";
#menu {
background-color: #999999;
width: 1200px;
height: 40px;
-webkit-box-shadow: 0px 0px;
box-shadow: 0px 0px;
}
#banner {
width: 1200px;
height: 280px;
}
tr td #navigation {
width: 200px;
height: 40px;
color: #FFFFFF;
font-family: "黑体";
font-style: normal;
font-weight: bolder;
font-size: 23px;
text-align: center;
text-shadow: 0px 0px;
vertical-align: middle;
line-height: 30px;
}
#bottom {
width: 1200px;
height: 100px;
}
#news {
color: #000000;
font-weight: lighter;
text-align: justify;
text-indent: 40px;
font-family: "楷体";
font-size: 20px;
line-height: 12px;
}
#newstitle {
color: #000000;
font-weight: bolder;
font-size: x-large;
text-align: left;
text-indent: 20px;
}

效果图（缩放比例80%）：

技术分享

以上是关于第七次随笔的主要内容，如果未能解决你的问题，请参考以下文章