主页 / 问题 / 1360302
Accepted
Alexei
Asked:2022-05-13 05:59:59 +0000 UTC2022-05-13 05:59:59 +0000 UTC

如何布置这些元素（文本，通过其图片可见的字母；按钮，里面是一个超出按钮边框的箭头）？[关闭]

  • 772

再会！

如何布置这些元素：

  1. 文本的第一个字母以不同的颜色突出显示（Active Trust 徽标）
  2. 图片可见的文本（Active Trust 标题出现在“Digital-agency”之后）
  3. 活动信任标头的下划线不完整（例如border-bottom 不起作用）。
  4. 文本折叠成一个圆圈，通过其中一个可见图片的符号（在第二块 Active Trust Digital Agency）
  5. 包含在此按钮之外结束的图像或箭头符号的按钮。

在此处输入图像描述

html

1 个回答

  1. Best Answer

    body {
 background-color: black
}

.logo {
 color: white;
}

.logo span{
 color: blue
}
    <div class="logo">
<span>A</span>ctive<br>
<span>T</span>rust
</div>

    1. 在此处讨论的文本上叠加图像背景 -仅在文本上叠加背景

    .someText {
 font-size: 30px;
 position: relative
}

.someText:after {
 content: '';
 position: absolute;
 bottom: -10px;
 left: 0;
 width: 100px;
 height: 2px;
 background-color: black;
}
    <div class="someText">Любой длинный большой заголовок чтобы показать линию</div>

    1. 可以在此处查看圆圈中的文本 -如何沿圆圈的轮廓制作文本？+ 结合第 2 点中的链接

    body {
 padding: 100px
}

.btn {
 width: 40px;
 height: 40px;
 position: relative;
 background-color: black;
}

.btn:after {
 content: 'любой элемент';
 position: absolute;
 left: -30px;
 top: 2px;
 color: blue;
}
    <div class="btn"></div>

    • 2

相关问题