CSS制作简易花束网站首页（新手适用）

最新推荐文章于 2024-01-11 09:09:37 发布

Ron韦斯莱

最新推荐文章于 2024-01-11 09:09:37 发布

阅读量1.2k

点赞数 3

本文链接：https://blog.csdn.net/qq_43537987/article/details/86483361

版权

这篇博客介绍了如何使用CSS为新手制作一个简易的花束网站首页。主要内容包括头部的制作，涉及h1标题的样式设置，如颜色、字体大小和下划线；以及内容部分的构建，包含商品分类的h2样式调整，图片的大小和位置，p标签文本的居中和颜色修改。此外，还展示了如何通过CSS创建图片边框来美化页面元素。

摘要由CSDN通过智能技术生成

效果展示：

在这里插入图片描述

制作头部：

在这里插入图片描述
思路：在h1标题中加入颜色和不同字体大小等样式，在标题下加条下划线即可。

<header>
    <h1><strong>浪漫の都</strong><em>___这一生只为与你相遇</em></h1>
    <hr size="2" color="hotpink" width="980px">
</header>

 header{
        width: 980px;
        margin: 0 auto 8px;
        height: 86px;
        line-height: 86px;
        text-align: center;
        font-family: 楷体;
        color: hotpink;
    }
    header strong{
        font-weight: normal;
        font-size: 30px;
    }
    header em{
        font-weight: normal;
        font-size: 20px;
    }