在圆圈内创建三个垂直点(省略号)

2024-01-10

我想做一个圆圈<div>,就像这张图片:

我已经尝试过这段代码。

.discussion:after {
  content: '\2807';
  font-size: 1em;
  background: #2d3446;
  width: 20px;
  height: 20px;
  border-radius: 100px;
  color:white;
}
<div class="discussion"></div>

我怎样才能正确地做到这一点?


你可以只使用:after伪元素与content: '•••' and transform: rotate。请注意,这是项目符号 HTML 特殊字符 http://www.fileformat.info/info/unicode/char/2022/index.htm , or \u2022.

div {
  position: relative;
  background: #3F3C53;
  width: 50px;
  height: 50px;
  color: white;
  border-radius: 50%;
  box-shadow: 0px 0px 15px 1px #4185BC;
  margin: 50px;
}
div:after {
  content: '•••';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(90deg);
  font-size: 15px; 
  letter-spacing: 4px;
  margin-top: 2px;
}
<div></div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在圆圈内创建三个垂直点(省略号) 的相关文章

  • PHP MySQL 使用选项/选择 HTML 表单标签进行多重搜索查询

    我正在尝试使用两个搜索字段设置基本的 MySQL LIKE 搜索 我不想拥有它 所以它有多个可选搜索字段 例如if isset POST city isset POST name 我不知道如何用 HTML 来做到这一点
  • html 和 body 元素的高度

    我一直在互联网上查找 min height 和 height 属性如何在 body 和 html 元素上工作 我在很多地方都看到过下面的代码 html height 100 body min height 100 上面的内容可以与其他一些
  • PyCharm 中有 HTML 块 {%%} 的快捷方式吗?

    我正在使用 HTML 块 例如 block content 经常使用 但必须输入括号和百分比符号很麻烦 有没有捷径或其他方法可以自动执行此操作 到目前为止我刚刚发现这个 PyCharm 中有插入 的快捷方式吗 https stackover
  • 将样式添加到 mat-autocomplete 的 mat-option

    我有这个 HTML代码在这里 https stackblitz com edit angular mat autocomplete with selected value vx1uqg file src 2Fapp 2Fautocomple
  • 如何使用 javascript 或 jquery 生成 CSS 路径?

    关于如何生成元素的 CSS 路径有什么建议吗 CSS 路径是识别特定元素所需的 css 选择器的路径 例如 如果我的 html 是 div div class bar ul li 1 li li 2 li li span class sel
  • CSS 中的像素与像素密度

    我对 HTML 和 CSS 非常陌生 我突然想到 当决定某个东西是 5px 时 比如说 由于像素的物理尺寸取决于密度 所以 5px 在 100 ppi 的屏幕上看起来肯定比在 300 ppi 的屏幕上看起来更大ppi 这是正确的吗 如果是
  • 删除数据表列中的额外填充

    你好 我创建了 JQuery DataTables 如下所示 所以我的问题是如何删除 图片 列中过多的填充 这就是我初始化表的方式 violators tbl DataTable aoColumnDefs bSortable false a
  • 在 iPhone 3GS 与 iPhone 4 上为 Mobile Safari 嵌入 HTML5 视频

    我在服务器上的 mp4 文件中有 H 264 AAC 编码的视频 mime 类型的视频 mp4 添加到 Web 服务器 IIS 7 并且我有一个带有视频标签的页面
  • 如何重置使用 JavaScript 更改的 CSS 属性?

    我的导航按钮的宽度从 100px 增加到 150px 当鼠标悬停在 nav li hover width 150px 但是使用 javascript 我已经做到了 无论选择哪个选项 宽度都将继续为 150px 当选择每个选项时 它会使其他选
  • 使用 jQuery/JS 打开时使
    标签的内容具有动画效果

    我只想要 HTML5 的内容details标记为 滑行 动画打开 而不是仅仅弹出打开 立即出现 这可以用 jQuery Javascript 实现吗 Fiddle http jsfiddle net 9h4Hq HTML
  • 如何防止 Iframe 在与浏览器交互后弄乱浏览器的历史记录?

    因此 就我而言 我使用 Iframe 将 Grafana 附加到我的页面 这为我提供了漂亮且易于使用的图表 可以注意到 每次在图表上进行放大或缩小 使用鼠标单击 交互后 Grafana 的 Iframe 都会在我的 Angular 页面上触
  • 保持未知数量的 div 居中,每行最多 4 个

    我有一个简单的问题 但我自己无法解决 简而言之 有一个未知电话我必须在页面中放置的元素数量 最多 每行 4 个元素 但仍居中 此图片给您一个提示 我为了示例而设置它 详细 在上图中我涵盖了不同的场景 例如 如果总共有 5 个元素 则应使用第
  • 如何将 Google Charts 与 Vue.js 库一起使用?

    我正在尝试使用 Vue js 库使用 Google Charts 制作图表 但我不知道如何添加到 div 这是我尝试做的 这是如何使用普通 javascript 添加图表 这是文档的代码示例 https developers google
  • jquery从变量中删除html元素

    我将 html 保存在变量中 var itinerary events today html 我有很多 html 和一个按钮我想删除 它的 ID 为 myButton 如何从变量中保存的 html 中删除它 我建议这种方法 var itin
  • HTML 中部分着色的阿拉伯语单词

    我不会说阿拉伯语 但我需要我们网站上对阿拉伯语的具体支持 我需要将部分阿拉伯语单词放在 span 与单词其他部分的风格不同 当我输入两个字符时 and 它们被组合成word 但是当我使用 HTML 标记时 span span 这些字母在输出
  • 如何阻止破折号自行包裹?

    我有一个标题 标题最后一个单词的末尾是一个破折号 单词和破折号之间没有空格 当浏览器窗口变小时 破折号会中断并换成新行 在自己的行上有一个破折号是不好的排版 如何停止破折号之前的换行 以便最后一个单词运行到新行 这是代码 h1 XYZ co
  • HTML 离线应用程序缓存,列出下载的文件

    作为我正在构建的离线 Web 应用程序的加载屏幕的一部分 使用缓存清单 http developer apple com library safari documentation iPhone Conceptual SafariJSData
  • 带有相对路径的 LESS CSS 背景

    我在使用 LESS 作为我的网站的样式表时遇到了问题 就我个人而言 我宁愿在CSS中使用相对路径而不是绝对路径 这只是我的习惯 但是现在当我使用带有导入功能的LESS时 我遇到了如下所示的问题 我有一个main less根文件夹中的文件 i
  • 如何获取浏览器视口中当前显示的内容

    如何获取当前正在显示长文档的哪一部分的指示 例如 如果我的 html 包含 1 000 行 1 2 3 9991000 并且用户位于显示第 500 行的中间附近 那么我想得到 500 n501 n502 或类似的内容 显然 大多数场景都会比
  • CSS 是否有不等于选择器?

    CSS中有类似 不等于 的东西吗 例如 我有以下代码 input 但对于某些输入 我需要将其作废 我想通过将类 reset 添加到输入标签来做到这一点 例如

随机推荐

  • jQuery 当前位置和滚动位置之间的差异

    我试图获取元素距顶部的当前距离与其滚动后的下一个位置之间的差异 事实上 我试图根据其距离来选择动画持续时间 我写了下面的代码 但它不能正常工作 I have 6菜单项 当我单击每个菜单项时 窗口滚动到其位置 但问题是 当我单击最后一项时 它
  • 从控制台运行 Zend Framework 2 操作不起作用

    我有一个 ZF2 应用程序从 Web 服务器正常运行 我需要从命令行运行一些操作 因为我想要执行一些计划任务 cron 作业 所以我找到了这些有用的链接 Zend框架的官方文档 http framework zend com manual
  • 将 vuex 状态与服务器同步的推荐策略

    想象一下这个简单的例子 您有一个 Vue JS 应用程序 用户可以在其中创建任务列表并对它们进行排序 这些列表应由服务器存储在数据库中 假设我们有一个ListComponent它完成了大部分用户体验 我的问题是 我应该使用哪种模式来处理前后
  • 最佳开源 LINQ 提供商 [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 如何更改 C++ STL 向量的特定元素

    vector
  • 表达式等于

    所以 我正在尝试找出表达式树 我试图添加动态等于可查询 其中 T 是几个不同的表之一 我首先检查表中是否包含我想要过滤的字段 ParameterExpression param Expression Parameter typeof TSo
  • COM 中的内存管理

    在COM服务器执行期间分配一块内存 然后通过输出参数将该内存块传递给客户端是很常见的 然后 客户端有义务使用 CoTaskMemFree 等方法释放该内存 问题是 这块内存分配在哪里 假设COM服务器和COM客户端处于不同的进程中 为了让客
  • TypeScript 中 jQuery 对象的类型是什么?

    我应该为 jQuery 元素使用什么类型 没有 jQuery 我会这样继续 export class Modal constructor protected element HTMLElement 但是 可以说element将是一个 jQu
  • 当包含 Spring 数据剩余时,Spring 以纯 JSON 而非 HAL 格式返回资源

    当我为我的实体使用 Spring Data Rest 提供的默认控制器时 一切都会正常工作 输出如下所示 links search href http localhost 8080 users search embedded users f
  • iOS 10 上强制使用软件键盘

    当蓝牙 HID 设备 如条形码扫描仪 处于活动状态时 有没有人知道如何强制 iOS 中的屏幕软件键盘 关于 SO 有一些古老的问题 但大多数都是通过手动调整键盘视图的框架来解决的 并且从 iOS 8 开始 该方法似乎不再适用 奇怪的是 似乎
  • 根据 div 的高度动态更改其上边距

    我有一个固定在网页一侧的 div 我需要该 div 垂直居中 使用 CSS 轻松完成 注意 div 的基础高度为 300px sidePanel margin 150px 0 0 0 top 50 position fixed 我遇到的问题
  • MySQL 在 Group By 查询中选择错误的列值

    这是我遇到的一个真正的菜鸟 MySQL 查询问题 我正在编写的游戏中有一个高分表 高分DB记录姓名 等级以及获得的分数 数据库中有许多接近重复的内容 例如 Name Level Score Timestamp key Bob 2 41 12
  • Visual Studio 2017 15.3.0 git 更改包括“storage.ide”,即使 .gitignore 中的 .vs/

    几天前我将VS 2017升级到15 3 0 从那时起 文件 storage ide 一直保留在我修改的文件中 即使我使用过VS 的建议 gitignore https github com github gitignore blob mas
  • 运算符“<”不能应用于“object”和“int”类型的操作数

    我正在 ASP NET 和 C 中创建用户登录 但是在编写函数后 由于错误而无法编译 错误指出 运算符 我想检查 ExecuteNonQuery 的返回值是否大于 0 否则登录会失败 该存储过程是在类的前面与已确认的数据库连接字符串一起创建
  • 展开角度以获得连续相位

    假设我有一系列与此类似的阶段 import numpy as np import matplotlib pyplot as plt phase np linspace 0 100 1000 np pi plt plot phase plt
  • Lisp 反转“全部”函数

    我想在 lisp 中编写一个函数 使用映射函数反转列表中的所有元素 但我不知道如何开始这个 我想我必须以某种方式使用内置的反向函数 例如 如果我有列表 1 2 3 4 5 6 7 8 9 我会得到 9 8 7 6 5 4 3 2 1 或者如
  • 如何在“--help”中定义单击子命令的顺序

    我有这样的代码 import click click group def entry point pass entry point add command lidtk data download documents main entry p
  • 网格上最长的路径,无需重新访问网格单元

    我正在寻找一种算法来找到网格上两点之间的最长路径 但附加的限制是您不能重新访问网格上的单元格 此外 您只能向上 向下 向左 向右移动 考虑到这些限制 我认为走最长的路径与尝试填充尽可能多的空间相同 然而 我在弄清楚如何做到这一点方面遇到了一
  • 在 SSRS 的一张图表中使用 2 个数据集

    是否可以拥有 2 个数据集并在 SSRS 报告的一张图表中显示它们的数据 还是我需要合并这些数据集 我在一个数据集中有已接听的电话数量 在另一个数据集中有未接的电话数量 我想在图表中显示它们 数据保存在不同的区域 这就是为什么我没有一开始就
  • 在圆圈内创建三个垂直点(省略号)

    我想做一个圆圈 div 就像这张图片 我已经尝试过这段代码 discussion after content 2807 font size 1em background 2d3446 width 20px height 20px borde