一侧呈一定角度的背景正方形[重复]

2024-02-19

我希望能够仅使用 CSS 创建一个透明背景,但一端有一个角度。我已经找到了各种方法来尝试做到这一点,但无法完全实现。我真的不想使用任何脚本,只想使用 CSS。

背景图像需要如下所示:


您可以使用边框来做到这一点:http://jsfiddle.net/wNhjb/ http://jsfiddle.net/wNhjb/

#shape {
   height: 0; 
   width: 80px;
   border-top: 80px solid blue;
   border-left: 40px solid transparent;
}

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

一侧呈一定角度的背景正方形[重复] 的相关文章

  • 让 Compass 将供应商前缀添加到动画选择器

    谁能告诉我如何让 Compass 在编译时将供应商前缀添加到 CSS3 动画选择器中 我的配置文件如下所示 http path css dir sass dir images dir img javascripts dir js outpu
  • jQuery hide() 动画向右滑动

    使用 jQuery 的hide 使用可选的持续时间参数的函数 我可以在我的网站上获得一些警报框 以优雅地滑出屏幕并消失 隐藏动画的默认方向似乎是向左滑动 尽管此行为未在hide 定义页 http api jquery com hide 我需
  • 使用 jQuery / JavaScript 将 Alpha 通道添加到背景颜色

    我有一个 jQuery 函数 它添加了一个Alpha通道到一个背景颜色当事件发生时 这是我的jsFiddle http jsfiddle net liormb SxQt8 1 CSS div background color rgb 100
  • 跨浏览器方法使子 div 适合其父级的宽度

    我正在寻找适合孩子的解决方案div进入它的父母width 我在这里看到的大多数解决方案不跨浏览器兼容 eg display table cell IE 不支持 lt 8 解决方案就是不声明width 100 默认为width auto 对于
  • 始终滚动 div 元素而不是页面本身

    我有一个带有内部的页面布局 div 包含页面上重要内容的元素 设计的重要部分是 content height 300px width 500px overflow scroll 现在 当包含的文本大于 300px 时 我需要能够滚动它 是否
  • 如何将 OTF/TTF 文件转换为 EOT 格式?

    我需要使用 font face 功能 并且我的字体是 OTF TTF 格式 而 Microsoft 浏览器仅支持 EOT 格式 我尝试使用微软工具WEFT 但它不起作用或者我不明白它是如何工作的 还有其他方法可以将我的字体转换为 EOT 格
  • 如何编辑 QProgressBar 的样式表

    我无法在我的应用程序中编辑进度条的颜色 仅编辑文本颜色 pyhton 3 9 PySide6 QT Creator 7 0 2 Python应用程序 https i stack imgur com 6hKFI png import sys
  • 使用 css resize:both 调整表格单元格的大小;不使用表

    使用 css resize both 调整表格单元格大小不适用于表格 我需要调整表格及其单元格的大小 可以使用 css 调整大小 css resize both 在 div 中有效 但在表标签中无效 table border 1 tr td
  • CSS Font-Face url 不起作用?

    我在使用 font face 选择器时遇到了一些问题 我有以下问题 font face font family MuseoSans 700 src url http mysite co uk clients reload Images st
  • 如何在我的 html 中使用 Flaticon 中的图标?

    我想给我的网站一些图标 现在我看到很多人使用Flaticon这个网站 我所做的就是在 CSS 中添加这样的内容 Font 1 font face font family Flaticon1 src url flaticon1 eot src
  • 带有右侧固定侧边栏的 Bootstrap 响应式网格

    我想创建一个带有类似引导程序的模板 它尊重网格的响应系统 在图中 导航栏和右侧 包含两个按钮 是粘性的 始终显示在视图上 我的问题是右侧 因为在引导网格系统中 右侧块将被视为单行 而主要内容包含多行 我怎样才能做到这一点 围绕整个 Boot
  • 使用无图像按钮有哪些优点?

    讨论关于这个答案 https stackoverflow com questions 520640 how can i use googles new imageless button how could i reverse enginee
  • TYPO3 显示子页面的内容,包括 css 类

    使用以下打字稿 我从一页上的子页面获取所有内容 lib allPid COA lib allPid 10 HMENU 10 special directory special value 2 1 TMENU 1 expAll 1 NO do
  • 垂直对齐两个弹性项目[重复]

    这个问题在这里已经有答案了 我有一个弹性容器 container和两个弹性项目 item one and item two 我想将第一个项目垂直居中并将第二个项目粘在底部 我不知道如何在这种情况下垂直对齐第一项 HTML div class
  • IE8 中空 div 层的 z-index 问题

    我在 IE8 中遇到 z index 问题 其他尚未测试 以下 JS 创建一些 html css document write img src border 0 document write div style background col
  • 如何在不设置动画的情况下突然更改 CSS 动画中的属性

    这是我试图弄清楚的 但没有使用 51 关键帧作为实现更改的黑客方法transform origin 这里有一个小提琴演示 http jsfiddle net p7pswnpq keyframes spin 0 transform origi
  • CSS:理解和调整字体的行距/行高

    有人问了一个非常相似的问题here https stackoverflow com questions 13701110 css remove line height leading on larger text但确实回答得足够了 CSS
  • 在桌面和移动设备上编写 2 列和 3 列的 Flexbox 代码(换行)

    我真的很难弄清楚这个 CSS flexbox 解决方案 基本上有两个问题 一个是 2 列布局 另一个是 3 列布局 2 列 我认为这可能非常简单 3 列 这可能更高级一些 容器类是 嗯 container 而孩子们只是 left right
  • 带缩略图的轮播和 bootstrap v4

    我看到了带有缩略图的轮播演示bootstrap 3 here http jsfiddle net talmand JS6JV 我正在尝试为 bootstrap v4 实现相同的功能 但无法弄清楚如何修复一些 UI 细节 例如左 右阴影覆盖整
  • 优化 CSS 交付 - Google 的建议

    谷歌建议在 head 中使用非常重要的 CSS 内联 并在内部使用其他 CSS

随机推荐

  • Google Javascript 自定义搜索 API:按图像 url 搜索图像

    我尝试按短语搜索图像并且它有效 但我需要按网址搜索图像 我需要找到相同的图像 但尺寸更大 div div
  • 如何在 IE8 中模拟最小宽度

    IE8 文档说它支持 min width 但它似乎对我不起作用 我想要的最小宽度的 html 位于表格单元格中 我在这里看到另一个问题 建议向每个单元格添加一个 1 像素高度的 div 并设置宽度 但这不起作用 出于某种原因 IE 将其渲染
  • UIView 带有圆角和阴影?

    我已经在一个应用程序上工作了几年 并收到了一个简单的设计请求 圆化 UIView 的角并添加阴影 按照下面给出的操作 我想要定制UIView 我只是想要一个带有圆角和浅色阴影的空白白色视图 没有照明效果 我可以一一做 但通常的clipToB
  • pandas 多索引数据帧,缺失值的 ND 插值

    pandas 是否可以在多索引数据帧中插入缺失值 下面的示例没有按预期工作 arr1 np array np arange 1 10 1 arr2 np array np arange 2 20 2 df1 pd DataFrame zip
  • 如何使用 PayPal 以编程方式退款?

    正在开发我的贝宝集成并且进展顺利 我想知道在需要退款的情况下是否有办法以编程方式进行退款 根据我的理解 您应该使用 Refund API
  • 将 SymPy 矩阵转换为 numpy 数组/矩阵的最佳方法是什么

    我不确定我一直在使用的方法是否sympy转换一个MutableDenseMatrix to a numpy array or numpy matrix目前是一个很好的做法 我有一个符号矩阵 例如 g sympy Matrix x 2 x 3
  • SendGrid API 密钥不起作用。 “所提供的授权无效、已过期或已撤销”

    SendGrid 似乎阻止我的 Node js 服务器发送电子邮件 我在发送电子邮件的响应中收到此错误消息 提供的授权无效 已过期或已撤销 我也有一个 API 密钥设置并遵循了文档 Answer recommended by Twilio
  • 去掉cpp生成的注释

    I use include frontend tokens mll in lexer mll 进而cpp C P frontend lexer mll o frontend lexer new mll生成lexer new mll 这一直有
  • 如何查看我的机器上安装的 gem 的源代码?

    我在 Rails 应用程序中安装了 Devise 我想通读源代码并了解它的工作原理 我查看了 Rails 应用程序的整个文件夹结构 但找不到任何代码 方法调用除外 我知道我可以从 Github 存储库中看到源代码 但我希望在我的编辑器和本地
  • 使用框架时在 PHP 中注释代码

    我正在使用以下命令创建一个简单的应用程序Kohana https en wikipedia org wiki Kohana framework PHP 框架 仅供参考 这是我第一次使用该框架 在开发类或函数时 我使用 DocBlock 注释
  • 将三星 S7 连接到 Android Studio

    我喜欢使用 Android Studio 直接在 Samsung S7 上启动我的应用程序 我已经通过在内部版本号上点击 7 次来在开发人员选项中启用调试模式 但在启动应用程序并获取 选择部署目标 对话框时我仍然看不到设备 我还需要做什么
  • Xdebug:[单步调试] 连接调试客户端超时,等待:200 毫秒。尝试过:本地主机:9003

    我的 php ini 配置 XDebug zend extension C xampp php ext php xdebug dll xdebug mode debug xdebug remote autostart on xdebug p
  • 无论我如何尝试都无法加载资源

    我正在尝试加载已添加到项目中的资源 它告诉我 路径中存在非法字符 现在 资源的名称是 ShortcutList txt 我不认为这有任何违法之处 我使用的代码是 public void InitShortcuts try string s
  • PowerShell get-acl 列出文件夹内容与 ReadAndExecute

    这是一个简单的问题 但我在谷歌或这里还找不到答案 通过使用 PowerShell 或 cmd 无第三方工具 如何以允许我区分 列出文件夹内容 和 ReadAndExecute 的方式检索文件夹权限 现在 当我在文件夹上执行 Get Acl
  • 如何在样式中引用主题属性?

    我有以下问题 我想自定义列表中行的外观 但在膨胀过程中抛出异常 style xml 中的一段代码 属性 xml
  • Mercurial 合并存储库作为分支

    我有两个 Mercurial 存储库 用于同一项目的不同主要修订 后一个版本是massive更改了项目的功能 尤其是 UI 但它仍然具有许多与早期版本相同的代码 为了方便起见 我将这些版本称为4 6 and 5 0和存储库项目 4 x an
  • 在 C++ 中使用什么来表示定点? [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在寻找用于财务数据的定点标准 您知道有哪些值得尝试吗 您对手工制作的定点类的性能有什么经验吗 Dr
  • 有没有比 PathGeometry.FillContainsWithDetail() 更有效的方法来检测多边形重叠/相交?

    我有一个方法占用了 25 的 cpu 时间 我每秒调用此方法约 27 000 次 是的 有很多电话 因为它经常更新 我想知道是否有人知道一种更快的方法来检测两个多边形是否重叠 基本上 我必须检查屏幕上的移动对象与屏幕上的静止对象 我正在使用
  • Angular 5 中从本地文件到 Typescript 数组的 JSON 数组

    我正在使用 Angular 5 开发一个网络应用程序 我有 JSON 文件 如下所示 id 0 title Some title id 1 title Some title 该文件存储在本地 我也有一个界面 export interface
  • 一侧呈一定角度的背景正方形[重复]

    这个问题在这里已经有答案了 我希望能够仅使用 CSS 创建一个透明背景 但一端有一个角度 我已经找到了各种方法来尝试做到这一点 但无法完全实现 我真的不想使用任何脚本 只想使用 CSS 背景图像需要如下所示 您可以使用边框来做到这一点 ht