求前端大手子指导一下如何实现

如何在图片素材实现给的纵向素材，实现图片2的样式
如何在图片素材实现给的纵向素材，实现图片2的样式
如何在图片素材实现给的纵向素材，实现图片2的样


<!DOCTYPE html>
<html>
<head>
    <title>热门新闻标题列表</title>
    <style>
        ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }
        li {
            padding: 10px;
            margin-bottom: 10px;
            background-color: #f7f7f7;
            border-radius: 5px;
            position: relative;
        }
        li span {
            display: inline-block;
            position: relative;
            z-index: 1;
            padding-right: 10px;
        }
        li span::before {
            content: '';
            position: absolute;
            top: 0;
            left: -20px;
            width: 10px;
            height: 10px;
            background-color: red;
            border-radius: 50%;
        }
    </style>
</head>
<body>
    <h1>热门新闻标题列表</h1>
    <ul>
        <li><span>1.</span>新闻标题1</li>
        <li><span>2.</span>新闻标题2</li>
        <li><span>3.</span>新闻标题3</li>
        <li><span>4.</span>新闻标题4</li>
        <li><span>5.</span>新闻标题5</li>
    </ul>
</body>
</html>

设置成背景图然后用 background-position 调整位置，具体的你去了解下

不知道你这个问题是否已经解决, 如果还没有解决的话:

你可以参考下这个问题的回答, 看看是否对你有帮助, 链接: https://ask.csdn.net/questions/7701169
你也可以参考下这篇文章：从头做图书馆管理系统课设，表示层的构建及选购图书页面的前后端制作~（后端篇2）
除此之外, 这篇博客: 前端模拟后端接口返回数据的方法中的 文件中与请求关联起来，当请求过多时，两者关联过于繁琐 部分也许能够解决你的问题, 你可以仔细阅读以下内容或者直接跳转源博客中阅读:
解决方案： 统一模拟数据文件的请求方式，将文件全部放到一个目录中，根据请求路径逐层放置
实现： 见【优化】
您还可以看一下郑逊敏老师的抖音快手短视频自媒体制作引流运营兼职创业赚钱盈利实战教程课程中的巧妙借势热点，实现快速涨粉小节, 巩固相关知识点

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^