【问题标题】:How to create this shape using css and html? [closed]如何使用 css 和 html 创建这个形状? [关闭]
【发布时间】:2021-03-10 12:41:46
【问题描述】:

你好!我的团队受雇构建一个可以为牙医管理诊所记录的 Web 应用程序,我负责前端,我如何使用 Web 技术(CSS、HTML、js)构建图像上显示的形状?

我没有找到任何为此目的而构建的库。

谢谢!

【问题讨论】:

  • 为什么不使用实际图像?否则就是 4 个三角形,上面有 1 个方块
  • SVG 在这里会很完美。使用 CSS 网格也会有所帮助。
  • “我的团队被录用了”,“我负责前端”,以及暗示的“我什至不知道从哪里开始”都不太顺利。如果您的尝试遇到特定问题,我敢打赌人们会帮助您。

标签: javascript html css web frontend


【解决方案1】:

如果是选择牙齿,那么标签输入和背景就可以了。

基本思路:

* {
  box-sizing: border-box;
}

label {
  display: inline-block;
  padding: 3px;
  border: solid 1px;
  background: linear-gradient(to bottom left, transparent 0 calc(50% - 1px), black, transparent calc(50% + 1px)) no-repeat, linear-gradient(to bottom right, transparent 0 calc(50% - 1px), black, transparent calc(50% + 1px)) no-repeat;
}

label input {
  display: block;
}
<label><input type="checkbox"></label>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-11-14
    • 1970-01-01
    • 2021-09-19
    • 2022-12-17
    相关资源
    最近更新 更多