javascript - 在javascript中为图像创建新标签

标签 javascript html css image

<分区>


想改进这个问题吗? 更新问题,使其只关注一个问题 editing this post .

关闭 7 年前

我想为 <img> 添加一个新标签像这样的 html 元素:

enter image description here

是否有一些 JS 插件可以在 CSS 中做类似的事情?

最佳答案

你可以用css做这样的事情

#par {
  position: relative;
}
#par img {
  width: 200px;
  height: 200px;
}
#tri {
  left: 0;
  top: 0;
  position: absolute;
  width: 0;
  height: 0;
  border-top: 100px solid red;
  border-right: 100px solid transparent;
}
#tri:before {
  content: 'New';
  position: absolute;
  left: 23px;
  top: -68px;
  transform: rotate(-45deg);
}
<div id="par">
  <img src="https://pixabay.com/static/uploads/photo/2016/01/23/16/02/experimental-1157660_960_720.png" />
  <div id="tri"></div>
</div>

For more css shapes take a look at here

关于javascript - 在javascript中为图像创建新标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36987767/

上一篇:html - 在 IE11 中转换旋转

下一篇:javascript - 表单验证无法正常工作,不检查条目就继续

相关文章:

javascript - React + Meteor : this. Prop 返回未定义

html - 为什么一张图片适合我的个人电脑,但在不同的电脑上尺寸不一样? HTML/CSS

javascript - jquery 匹配数据的多个值

html - 最小化页面时如何使我的网页响应

javascript - jQuery 通知插件

javascript - 从组中获取选定的单选按钮

javascript - JavaScript 音频的 future ?

jquery - 尝试使用 jQuery 隐藏 html 表的列

javascript - 为什么它们有不同的尺寸? (next/image & img html 元素)

显示白色背景的 ASP 控件上的 Jquery 单选按钮