【博客系统】前端页面

news2024/11/17 15:47:42

博客系统

实现一个简单的博客系统。

当前先完成页面设计部分，通过学习的前端知识来构建出网页。

主要分成四个部分：

  • 博客列表页
  • 博客正文页
  • 博客登陆页
  • 博客编辑页

预期效果

博客列表页效果

image-20221230121121176

博客详情页效果

image-20221230120831442

博客登陆页效果

image-20221230120923649

博客编辑页效果

image-20221230121034789

实现博客列表页

实现导航栏

写一个页面的时候，一定要先确定好页面的结构（页面的结构是十分重要的，会直接影响到后续的CSS、JS代码）

  • 导航栏里面包含logo， 标题，以及一些按钮（跳转链接）
  • 为实现左右排列，在logo和按钮之间加上一个spacer作为占位器
<!-- 导航栏 -->
<div class="nav">
    <img src="img/logo2.jpg" alt="">
    <span class="title">我的博客系统</span>
    <!-- 用来占据中间位置 -->
    <span class="spacer"></span>
    <a href="blog_list.html">主页</a>
    <a href="blog_edit.html">写博客</a>
    <a href="logout">注销</a>
</div>

对于导航栏来说，每个页面都需要用到，因此要把样式提取出来

  • 清楚浏览器默认样式
  • 准备一个图片作为背景
  • 需要把html和body高度都设为100%， 使背景高度和浏览器窗口高度一样
  • 导航栏内部使用flex布局，用来排列logo和一些按钮
/*清楚浏览器默认样式*/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

image-20221229185151348

其中的0.4是透明度alpha， 是一个0-1之间的小数，越小越透明

/* 设置整体页面高度和页面背景图 */
html, body {
    height: 100%;
    background-image: url(../img/cat.jpg);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* 上方导航栏 */
.nav {
    width: 100%;
    height: 50px;
    background-color: rgba(51, 51, 51, 0.4);
    color: #fff;
    display: flex;
    justify-content: left;
    align-items: center;
}
/* 导航栏中的图标 */
.nav img {
    width: 40px;
    height: 40px;
    margin-left: 30px;
    margin-right: 10px;
    border-radius: 50%;
}
/* 导航栏中的占位器 */
.nav .spacer {
    width: 70%;
}
/* 导航栏中的按钮 */
.nav a {
    color: #fff;
    text-decoration: none;
    padding: 0 10px;
}

引入common.css

<link rel="stylesheet" href="css/conmmon.css">

实现版心

  • container作为版心，实现居中对齐的效果
  • 左侧放用户信息
  • 右侧放博客列表
<!-- 版心 -->
<div class="container">
    <!-- 左侧个人信息 -->
    <div class="container-left">
    </div>
    <!-- 右侧内容详情 -->
    <div class="container-right">
    </div>
</div>

编辑common.css

/* 页面内容容器, 版心 */
.container {
    /* 使用 calc 计算高度 */
    height: calc(100% - 50px);
    /* 设置版心宽度 */
    width: 1000px;
    /* 水平居中 */
    margin: 0 auto;
    /* 使用弹性布局 */
    display: flex;
    justify-content: space-between;
    align-items: center;
}
/* 左侧部分, 用来放置用户信息 */
.container-left {
    height: 100%;
    width: 200px;
}
/* 右侧部分, 用来放置正文 */
.container-right {
    height: 100%;
    /* 和左侧部分中间留出 5px 间隙 */
    width: 795px;
    /* 如果内容溢出就自动加上滚动条 */
    overflow: auto;
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 10px;
}

实现个人信息

<!-- 左侧个人信息 -->
<div class="container-left">
    <div class="card">
        <img src="img/doge.jpg" class="avtar" alt="">
        <h3>张宇</h3>
        <a href="http:www.github.com">github 地址</a>
        <div class="counter">
            <span>文章</span>
            <span>分类</span>
        </div>
        <div class="counter">
            <span>2</span>
            <span>1</span>
        </div>
    </div>
</div>

编辑common.css

/* 展示用户信息的卡片 */
.card {
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 10px;
    padding: 30px;
}
/* 用户头像 */
.card img {
    width: 140px;
    height: 140px;
    border-radius: 50%;
}
/* 用户名 */
.card h3 {
    text-align: center;
    padding: 10px;
}
/* 用户 github 链接 */
.card a {
    display: block;
    text-align: center;
    color: #999;
    text-decoration: none;
    padding: 10px;
}
/* 展示文章数目的面板 */
.card .counter {
    padding: 5px;
    display: flex;
    justify-content: space-around;
}

实现博客列表页

  • 每个博客用div.blog来表示
  • 每个博客中包含标题，发布时间，描述，查看全文按钮。
<!-- 右侧内容详情 -->
<div class="container-right">
    <!-- 每一篇博客包含标题, 摘要, 时间 -->
    <div class="blog">
        <div class="title">我的第一篇博客</div>
        <div class="date">2021-06-02</div>
        <div class="desc">
           从今天起, 我要认真敲代码. Lorem ipsum, dolor sit amet consectetur
adipisicing elit. Cum distinctio ullam eum ut
           veroab laborum numquam tenetur est in dolorum a sint, assumenda
adipisci similique quaerat vel.
           Facere,
           et.
        </div>
        <a href="blog_content.html?blogId=1" class="detail">查看全文 &gt;&gt;</a>
    </div>
    <div class="blog">
        <div class="title">我的第二篇博客</div>
        <div class="date">2021-06-02</div>
        <div class="desc">
           从今天起, 我要认真敲代码. Lorem ipsum, dolor sit amet consectetur
adipisicing elit. Cum distinctio ullam eum ut
           veroab laborum numquam tenetur est in dolorum a sint, assumenda
adipisci similique quaerat vel.
           Facere,
           et.
        </div>
        <a href="blog_content.html?blogId=2" class="detail">查看全文 &gt;&gt;</a>
    </div>
</div>

创建 blog_list.css

这部分内容不再是公共部分，放到单独的css当中。

  • 使用伪类选择器.blog .detail:hover，实现光标悬停时修改样式的功能。
  • 给.blog .detail中加上过渡效果transition: all 0.3s是悬停的样式改变更加逼真
.blog {
    padding: 20px;
    width: 100%; 
}

.blog .title {
    text-align: center;
    font-size: 22px;
    font-weight: bold;
    padding: 10px 0;
}

.blog .date {
    text-align: center;
    color: green;
    padding: 10px 0;
}

.blog .desc {
    text-indent: 2em;
}
/*查看全文按钮*/
.blog a {
    display: block;
    width: 140px;
    height: 40px;
    margin: 10px auto;
    border: 2px black solid;/*加上边框*/
    color: black;
    line-height: 40px;
    text-align: center;
    text-decoration: none;
    transition: all 0.5s;
}

.blog a:hover {
    background-color: #333;
    color: white;
}

实现博客正文页

引入导航栏

这部分代码和blog_list.html中相同，直接复制即可

<!-- 导航栏 -->
<div class="nav">
    <img src="img/logo2.jpg" alt="">
    <span class="title">我的博客系统</span>
    <!-- 用来占据中间位置 -->
    <span class="spacer"></span>
    <a href="blog_list.html">主页</a>
    <a href="blog_edit.html">写博客</a>
    <a href="logout">注销</a>
</div>

引入common.css样式

<link rel="stylesheet" href="css/conmmon.css">

引入版心

这部分代码和blog_list.html相同，直接复制即可

<!-- 版心 -->
<div class="container">
    <!-- 左侧个人信息 -->
    <div class="container-left">
    </div>
    <div class="container-right">
        
    </div>
</div>

引入个人信息

直接复制

<!-- 左侧个人信息 -->
<div class="container-left">
    <div class="card">
        <img src="img/doge.jpg" class="avtar" alt="">
        <h3>张宇</h3>
        <a href="http:www.github.com">github 地址</a>
        <div class="counter">
            <span>文章</span>
            <span>分类</span>
        </div>
        <div class="counter">
            <span>2</span>
            <span>1</span>
        </div>
    </div>
</div>

引入个人信息样式:

<link rel="stylesheet" href="CSS/blog_detail.css">

实现博客正文

  • 博客内容整体放到div.blog-content当中
  • 博客内容中包含博客标题（h3）,博客时间（div.date)，博客正文（p)
<div class="blog-content">
    <!-- 博客标题 -->
    <h3>我的第一篇博客</h3>
    <!-- 博客时间 -->
    <div class="date">2021-06-02</div>
    <!-- 博客正文 -->
    <p>
       从今天起我要好好敲代码.
       Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut recusandae
omnis natus ut! Autem alias
       ullam sit facilis ipsa dolore, molestiae neque aperiam in a facere dolor
mollitia dolorum animi.
       Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut recusandae
omnis natus ut! Autem alias
       ullam sit facilis ipsa dolore, molestiae neque aperiam in a facere dolor
mollitia dolorum animi.
       Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut recusandae
omnis natus ut! Autem alias
       ullam sit facilis ipsa dolore, molestiae neque aperiam in a facere dolor
mollitia dolorum animi.
    </p>
    <p>
       Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium sint
accusantium, enim iste
       corrupti itaque, omnis alias maiores nemo quae rerum deleniti facere
officiis iure velit. Blanditiis
       pariatur delectus perferendis.
       Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium sint
accusantium, enim iste
       corrupti itaque, omnis alias maiores nemo quae rerum deleniti facere
officiis iure velit. Blanditiis
       pariatur delectus perferendis.
    </p>
</div>

创建博客正文的css.

/* 博客正文容器 */
.blog-content {
    padding: 30px;
}
/* 博客标题 */
.blog-content h3 {
    text-align: center;
    padding: 20px 0;
}
/* 博客日期 */
.blog-content .date {
    color: #008000;
    padding: 10px 0;
    text-align: center;
}
/* 博客内容段落 */
.blog-content p {
    text-indent: 2em;
    padding: 10px 0;
}

最后引入即可。

实现博客登陆页面

引入导航栏

<!-- 导航栏 -->
<div class="nav">
    <img src="img/logo2.jpg" alt="">
    <span class="title">我的博客系统</span>
    <!-- 用来占据中间位置 -->
    <span class="spacer"></span>
    <a href="blog_list.html">主页</a>
    <a href="blog_edit.html">写博客</a>
    <a href="logout">注销</a>
</div>

引入样式

实现版心

  • 使用flex使登陆对话框能够在页面水平垂直居中
<!-- 版心 -->
<div class="login-container">
    
</div>

​ 创建login.css

.login-container {
    width: 100%;
    height: calc(100% - 50px);
    display: flex;
    justify-content: center;
    align-items: center;
}

引入。

实现登录框

  • 登录框整体放到div.login-dialog中
  • 内不包含三行，使用div.row
  • 每个行里分别包含，用户名输入框，密码输入框，提交按钮
<!-- 中间的登陆框 -->
<div class="login-dialog">
    <h3>登陆</h3>
    <div class="row">
        <span>用户名</span>
        <input type="text" id="username">
    </div>
    <div class="row">
        <span>密码</span>
        <input type="password" id="password">
    </div>
    <div class="row">
        <button id="submit">提交</button>
    </div>
</div>

编辑css代码

.login-dialog {
    width: 400px;
    height: 400px;
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 10px;
}
.login-dialog h3 {
    padding: 50px 0;
    text-align: center;
}
.login-dialog .row {
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.login-dialog .row span {
    display: block;
    width: 100px;
    font-weight: 700;
}
#username, #password {
    width: 200px;
    height: 40px;
    line-height: 40px;
    font-size: 24px;
    border-radius: 10px;
    border: none;
    outline: none;
    text-indent: 10px;
}
#submit {
    width: 300px;
    height: 50px;
    color: white;
    background-color: green;
    border: none;
    border-radius: 10px;
}
#submit:active {
    background-color: #666;
}

实现博客编辑页

引入导航栏

<!-- 导航栏 -->
<div class="nav">
    <img src="img/logo2.jpg" alt="">
    <span class="title">我的博客系统</span>
    <!-- 用来占据中间位置 -->
    <span class="spacer"></span>
    <a href="blog_list.html">主页</a>
    <a href="blog_edit.html">写博客</a>
    <a href="logout">注销</a>
</div>

实现编辑区

  • 整个编辑区放到div.blog-edit-container当中
  • 里面包含一个标题编辑区，和内容编辑区
  • 标题编辑区，包含一个input，用来填写标题，以及一个button按钮用于提交
  • 内容编辑区先创建一个div#editor，后面使用editor.md初始化
<!-- 编辑框容器 -->
<div class="blog-edit-container">
    <!-- 标题编辑区 -->
    <div class="title">
        <input type="text" placeholder="在这里写下文章标题" id="title">
        <button id="submit">发布文章</button>
    </div>
    <!-- 创建编辑器标签 -->
    <div id="editor"></div>
</div>

创建blog_edit.css

  • #editor需要使用opacity: 80%设置透明度，如果直接使用background-color后面被editor.md覆盖掉
.blog-edit-container {
    width: 1000px;
    height: calc(100% - 50px);
    margin: 0 auto;
}
.blog-edit-container .title {
    width: 100%;
    height: 50px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#title {
    height: 40px;
    width: 890px;
    text-indent: 10px;
    border-radius: 10px;
    outline: none;
    border: none;
    background-color:rgba(255, 255, 255, 0.8);
}
#submit {
    height: 40px;
    width: 100px;
    color: white;
    background-color: orange;
    border: none;
    outline: none;
    border-radius: 10px;
}
#editor {
    border-radius: 10px;
    /* 针对 #editor 用 bgc 属性无法设置半透明了. 里面包含的内容带了背景色 */
    /* background-color:rgba(255, 255, 255, 0.8); */
    /* 可以使用 opacity 属性实现 */
    opacity: 80%;
}

引入editor.md

editor.md是一个开源的页面markdown编辑器组件

官网

  1. 下载editor.md

从官网下载到压缩包当中。目录结构如下：

image-20221230130303485

  1. 引入依赖
<!-- 引入 editor.md 的依赖 -->
<link rel="stylesheet" href="editor.md/css/editormd.min.css" />
<script src="js/jquery.min.js"></script>
<script src="editor.md/lib/marked.min.js"></script>
<script src="editor.md/lib/prettify.min.js"></script>
<script src="editor.md/editormd.js"></script>
  1. 初始化

编辑blog_edit.html

// 初始化编辑器
let editor = editormd("editor", {
    // 这里的尺寸必须在这里设置. 设置样式会被 editormd 自动覆盖掉.
    width: "100%",
    // 高度 100% 意思是和父元素一样高. 要在父元素的基础上去掉标题编辑区的高度
    height: "calc(100% - 50px)",
    // 编辑器中的初始内容
    markdown: "# 在这里写下一篇博客",
    // 指定 editor.md 依赖的插件路径
    path: "editor.md/lib/"
});

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/128831.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

C++数据结构--跳表的思想--手把手教你实现跳表--0721

C++数据结构--跳表的思想--手把手教你实现跳表--0721

1、 跳表--skiplist skiplist本质上是一种查找结构&#xff0c;跟平衡搜索树和哈希表的价值是一样的。跳表首先是一个链表&#xff0c;它是在链表的基础上发展的。但一般的链表进行查找数据只能全部遍历&#xff0c;时间复杂度为O(n)。 William Pugh的优化&#xff1a; 假如每…
阅读更多...
Kafka一次线上问题

Kafka一次线上问题

线上问题&#xff1a; Kafka: 客户说Broker不时会发生些错误日志&#xff0c;也看到topic的tps下降很快很明显&#xff0c; 日志看是ISR在不断的伸缩&#xff0c; 监控发现发生问题时的CPU、IO、磁盘都没有瓶颈 再查看堆栈信息&#xff1a;可看到关键信息&#xff1a; 有锁…
阅读更多...
R语言raster包批量读取单一或大量栅格图像

R语言raster包批量读取单一或大量栅格图像

本文介绍基于R语言中的raster包&#xff0c;读取单张或批量读取多张栅格图像&#xff0c;并对栅格图像数据加以基本处理的方法。 1 包的安装与导入 首先&#xff0c;我们需要配置好对应的R语言包&#xff1b;前面也提到&#xff0c;我们这里选择基于raster包来实现栅格图像数据…
阅读更多...
TestStand-单执行界面

TestStand-单执行界面

文章目录用户界面运行流程例程创建前面板设置用户界面主窗口前面板控件配置用户事件用户界面运行流程 用户界面设计的基本元素&#xff1a;管理控件、可视化控件、连接、应用程序启动及关闭、注册事件、处理事件。 LabVIEW中通过Regesiter Event Callback注册事件。 LabVIEW-Te…
阅读更多...
flink内存管理, 增加Task内存大小,减少ManageMemory, network内存的方法

flink内存管理, 增加Task内存大小,减少ManageMemory, network内存的方法

问题描述 flink默认分配的内存&#xff0c;不合理&#xff0c;jvm 堆内存太小&#xff0c;其他内存太大。向yarn申请8G内存&#xff0c;最后分配到heap的大小才3.2G&#xff0c;不是让人抓狂吗&#xff1f; 以上是&#xff0c;向yarn申请8G内存&#xff0c;实时分配的内存是上…
阅读更多...
“破壁者”氚云，打破低代码之困

“破壁者”氚云，打破低代码之困

互联网云大厂的“火”已经烧红了低代码领域的半边天。 自低代码在国内盛行以来&#xff0c;尤其是时至2022年末&#xff0c;阿里、腾讯、华为等云大厂的跑马圈地仍如火如荼&#xff0c;动作密集程度堪比机关枪。 面对日益增长的企业数字化业务需求&#xff0c;产品经理只需少…
阅读更多...
编译器设计(十三)——指令调度

编译器设计(十三)——指令调度

一、简介 对程序块或过程中的操作进行排序以有效利用处理器资源的任务称为指令调度&#xff08;instruction scheduling&#xff09;。调度器的输入是由目标机汇编语言操作组成的一个部分有序的列表&#xff0c;输出是同一列表的一个有序版本。 一组指令的执行时间严重依赖于…
阅读更多...
什么是云存储？有什么优势？

什么是云存储？有什么优势？

在云计算中&#xff0c;用户将数据保存在远程位置。它可以通过互联网连接访问&#xff0c;而不是在本地或物理上(在硬盘上)访问。而云存储成为最实用有效的方式之一。它有助于在线存储数据。 什么是云存储? 云存储是指安全、全局和可扩展的数据存储。它用于存储不可变数据&…
阅读更多...
智慧工厂的大脑——APS生产排程系统

智慧工厂的大脑——APS生产排程系统

生产计划排程是生产管理中的核心工作&#xff0c;或许很多人不同意这个观点&#xff0c;只是因为这个观点的前提是生产计划排程在生产管理中真正起到了作用&#xff0c;目前国内制造业的现状还不能体现出生产计划排程的真正作用&#xff0c;所以也没有人认为它是最核心的工作&a…
阅读更多...
蓝桥杯Python练习题11-闰年判断

蓝桥杯Python练习题11-闰年判断

资源限制   内存限制&#xff1a;256.0MB C/C时间限制&#xff1a;1.0s Java时间限制&#xff1a;3.0s Python时间限制&#xff1a;5.0s 问题描述   给定一个年份&#xff0c;判断这一年是不是闰年。 当以下情况之一满足时&#xff0c;这一年是闰年&#xff1a;   1. 年…
阅读更多...
“集合划分问题”如何解决？这里教你个妙招，轻松掌握这类问题~

“集合划分问题”如何解决？这里教你个妙招，轻松掌握这类问题~

目录 “集合划分”这类问题的解题思路 一、划分为k个相等的子集 二、火柴拼正方形 “集合划分”这类问题的解题思路 这类题一般都会描述成这个样子&#xff1a;“给你一个数组&#xff0c;是否能将他划分成n个数值相等的子集&#xff1f;”&#xff0c;再或者有些可能题目描述…
阅读更多...
MinIO高性能对象存储

MinIO高性能对象存储

一、MinIO高性能对象存储 MinIO是一个高性能对象存储解决方案&#xff0c;它提供了与Amazon Web Services S3兼容的API&#xff0c;并支持所有核心S3功能。 MinIO旨在部署任何地方—公共或私有云、裸机基础设施、协调环境和边缘基础设施。本文档说的是Windows平台上MinIO部署的…
阅读更多...
接口测试自动化框架选型

接口测试自动化框架选型

1、fiddler fiddler 是一个 HTTP 协议调试代理工具&#xff0c;Web 和手机测试都会用到&#xff0c;同时也支持接口测试。它能够记录并检查所有你的电脑和互联网之间的 http 通讯&#xff0c;设置断点&#xff0c;查看所有的“进出”Fiddler 的数据(指 cookie,html,js,css 等文…
阅读更多...
ASP.NET大型药品销售ERP系统源码

ASP.NET大型药品销售ERP系统源码

ASP.NET医药ERP管理系统源码 药品销售管理系统源码 源码分享&#xff01;需要源码学习可私信我。 一、源码特点 1、渠道销售商在把药品从厂商销售到医院时&#xff0c;需要管理大量的数据&#xff0c;这些通常包括药品从厂商采购数据、药品销售到商业公司的数据&#xff0c;以…
阅读更多...
Python文件基础操作(6)

Python文件基础操作(6)

python学习之旅(六) &#x1f44d;基础语法部分笔记(一) &#x1f44d;条件判断部分笔记(二) &#x1f44d;循环语句部分笔记(三) &#x1f44d;函数使用部分笔记(四) &#x1f44d;数据容器部分笔记(五) &#x1f44d;文件操作部分笔记(六) 一.文件编码 编码就是一种规则集合&…
阅读更多...
数据湖---hudi核心概念

数据湖---hudi核心概念

文章目录TimelineTable & Query TypesTable Types查询类型COWMOR索引Hudi索引类型索引选择策略File Layouts元数据表元数据表的动机研究中的一些数字&#xff1a;支持多模态索引写操作操作类型UPSERTINSERTBULK_INSERTDELETE写入路径schema 演进key生成并发控制Datasource …
阅读更多...
强强联合，怿星科技艾拉比携手斩获“铃轩奖”

强强联合，怿星科技艾拉比携手斩获“铃轩奖”

12月23日—24日&#xff0c;汽车行业的年度盛典2022中国汽车供应链峰会&#xff08;CASCS2022&#xff09;盛大开幕&#xff0c;全国汽车供应链大咖再次聚首中国车谷&#xff0c;怿星科技CEO潘凯在圆桌《新汽车软件到底怎么办》上分享了观点。会议同期&#xff0c;国内最具权威…
阅读更多...
十年底层创新，2023年亚马逊云科技或再创新高

十年底层创新，2023年亚马逊云科技或再创新高

2006年&#xff0c;亚马逊云科技推出了第一代公有云产品Amazon S3和Amazon EC2&#xff0c;由此开创了企业IT的历史——云计算从此开始改变整个企业IT市场。2013年&#xff0c;亚马逊云科技再次开创了历史&#xff0c;推出了首个自研芯片Amazon Nitro&#xff0c;由此打开了全球…
阅读更多...
屏幕录制下载安装？这3个软件，亲测好用

屏幕录制下载安装？这3个软件，亲测好用

很多小伙伴在使用电脑进行学习、娱乐和工作的时候&#xff0c;或多或少遇到过需要使用屏幕录制功能的时候。那么有什么特别好用的屏幕录制软件吗&#xff1f;屏幕录制下载安装怎么进行&#xff1f;今天小编分享3款软件&#xff0c;特别好用。 屏幕录制下载1&#xff1a;爱拍录屏…
阅读更多...
朗润国际期货技术分析——日内交易图表类型

朗润国际期货技术分析——日内交易图表类型

一张图表胜过千言万语。你以前听说过这句话&#xff0c;对吗&#xff1f;在日内交易员的世界里&#xff0c;一张图表往往比千言万语更有价值。它不仅告诉我们过去发生了什么&#xff0c;而且告诉我们一个市场在未来可能会做什么。它将继续走高还是走低&#xff1f;它是否处于一…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023