css入门练手静态网页项目之第一天代码

最新推荐文章于 2024-07-08 11:48:12 发布

坏家伙康康

最新推荐文章于 2024-07-08 11:48:12 发布

阅读量5k

点赞数 5

分类专栏： css

本文链接：https://blog.csdn.net/kangkanggegeg/article/details/77460746

版权

css 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

今天要完成的是主页面index.html

首先上效果图：

这里写图片描述

描述：1.中间是swf动画。如下导入：

<embed src="images/index.swf" type="" width="712px" height="428px">

2.下面有个ENTER链接跳转页面，是白色的（因为默认链接是蓝色的）。在body里面用link标签修饰。
下面稍微介绍一下link标签：

<body link="颜色">

它对网页中所有未单独设置的元素起作用。

<body alink="颜色">

使用alink可以设置鼠标单击超链接时的颜色

<body vlink="颜色">

使用vlink可以设置已访问过的超链接文字的颜色

最后代码实现：

<body link="white" alink="#0066ff" vlink="#ff0000">

3.最下面也是一个图片，代码在css文件里面写，如下：
下面的路径解释： ../是转到上一目录。路径如下图：
这里写图片描述

background: url("../images/copyright.jpg") no-repeat;

到这里了上代码吧。

首先index.html代码

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>河畔林语</title>
   <link href="css/index.css" rel="stylesheet" type="text/css" />
</head>
<body link="white" alink="#0066ff" vlink="#ff0000">
<div class="swf">
    <embed src="images/index.swf" type="" width="712px" height="428px">
<div class="enter">
    <a href="url">ENTER</a></div>
<div class="end">
</div>
</div>
</body>
</html>

index.css代码

        *{
            margin: 0px;
            padding: 0px;
        }
        body{
            background: url("../images/bg.jpg") repeat;
        }
        .swf {
            position: absolute;
            left:50%;
            top:50%;
            margin-left: -356px;
            margin-top: -215px;
        }
        .enter {
            width: 100%;
            font-size: 18px;
            text-align: center;
            color:red;
            font-weight: bold;
            text-decoration: underline;
            margin-top: 8px;
        }
        .end{
            width: 574px;
            height: 70px;
            background: url("../images/copyright.jpg") no-repeat;
            margin: 0 auto;
        }

完事儿。

如果你也想手动敲一遍代码，可以点击下载这个index主页面的压缩包

拜拜！さよなら！！！

坏家伙康康

关注

5
点赞
踩
14

收藏

觉得还不错? 一键收藏
0
评论
css入门练手静态网页项目之第一天代码

今天要完成的是主页面index.html首先上效果图：描述：1.中间是swf动画。如下导入：<embed src="images/index.swf" type="" width="712px" height="428px">2.下面有个ENTER链接跳转页面，是白色的（因为默认链接是蓝色的）。在body里面用link标签修饰。下面稍微介绍一下link标签：<body link="颜色">它对网
复制链接

扫一扫

专栏目录