CSS/HTML简单静态页面

最新推荐文章于 2024-06-06 13:53:18 发布

还不下马受降

最新推荐文章于 2024-06-06 13:53:18 发布

阅读量413

点赞数 1

分类专栏： css/html基础文章标签： css html

本文链接：https://blog.csdn.net/weixin_43865846/article/details/109564201

版权

                           ****使用CSS/HTML创建一个简单的页面****

效果图

页面效果，尺寸为题分为两张图
学习了CSS以及HTML基础知识使用的是一些很基础的知识，画出了框架。
有一些简单的页面功能: 连接的hover效果，设置锚点。
CSS样式文件夹名称为styl.css，下载以后应当注意引入CSS文件的文件名称。
初学基础知识，为练习，甚是简陋，待日后完善。
在这里插入图片描述

HTML代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
     <link rel="stylesheet" href="style.css">
     
</head>

<body>
    <div id="top" class="w header">
         <!-- 头部开始--------------------------------------- -->
       <div class="logo"><img src="imgs/logo.jpg" alt=""></div>
       <div class="nav">
           <ul>
               <li> <a href="#">导航栏</a></li>
               <li><a href="#" >jojo故事起源</a></li>
               <li><a href="#">剧情发展</a></li>
           </ul>
       </div>

       <div class="search">
           <input type="text" value="输入关键字">
           <button><img src="imgs/search_button.png" alt="cao"></button>
       </div> 

       <div class="id">
           <a href="#">ID:JOJOJOJOJOJO</a>
       </div>

最低0.47元/天解锁文章

还不下马受降

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
CSS/HTML简单静态页面

****使用CSS/HTML创建一个简单的页面****效果图页面效果，尺寸为题分为两张图学习了CSS以及HTML基础知识使用的是一些很基础的知识，画出了框架。有一些简单的页面功能: 连接的hover效果，设置锚点。CSS样式文件夹名称为styl.css，下载以后应当注意引入CSS文件的文件名称。初学基础知识，为练习，甚是简陋，待日后完善。**HTML代码**<!DOCTYPE html><html lang...
复制链接

扫一扫

专栏目录