整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
者：前端日志
转发链接：https://mp.weixin.qq.com/s/zoEfqIwfsnAWVO8L7xuUuQ
无聊打发时间，利用css简单写一个给网站文章内容的右上角添加一个原创标识；
用来提醒他人本篇为本站原创，转发文章时候请附转载地址。
首先，我们修改下方css类名“tx-box”改为你自己文章最外层盒子的类名，找不到可联系小编鹏仔帮你哦。
然后，修改background 的图片路径，图片大家自行下载（ps简单做了两个小图标，一个带白的阴影，一个不带，自行选择，psd忘记保存，也没什么需要修改），引入。
下载图片 iqzhan.com/post/69.html
接着将下方css放到网站公共css中，或者找到文章区域引入css的文件。
CSS
.tx-box .info-con{
position: relative;
}
.tp-yuanchuang{
position: absolute;
top: 0;
right: 0;
z-index: 1;
opacity: .8;
width: 110px;
height: 70px;
background: url(图片路径) no-repeat;
background-size: auto;
}opacity为水印透明度，0-1范围，如果觉得颜色比较重，可往小的设置 .5
最后，我们在编辑文章时候，哪篇文章需要，我们在文章编辑时，编辑器的html中，放入下方html代码即可。
Markup
<div class="tp-yuanchuang"></div>官网是这样介绍的：使用我们的颜色选择器、颜色表和HTML颜色名称来获取HTML颜色代码、Hex颜色代码、RGB和HSL值。即刻开始吧！
寻找完美色彩从未如此简单，使用我们的HTML颜色选择器来浏览上百万的颜色和色彩搭配。
颜色选择器
颜色选择器动图
操作：
选取颜色
点击左侧颜色样本将其添加到您的调色板。
保存颜色
在您的调色板上保存和撤销保存颜色；下次您访问时候它们会在这里。
导出颜色
将您当前的调色板以Hex、RGB、HTML、CSS和SCSS 格式输出。试一下吧！
有了这些扁平化设计、Material Design和网页安全颜色表，一定可以为您的网页或应用程序找到完美的色彩方案 – 只需不停地寻找！
颜色表
颜色表动图
现代浏览器支持140种已命名的颜色，如下所列。根据名称、Hex代码或RGB值将其用于您的HTML和CSS。
颜色名
如何使用HTML颜色名
之所以建立HTML颜色代码，是因为我们认为设计工具本身有应有精良的设计。如果您喜欢这个网站或有何建议与反馈，欢迎您随时发电子邮件与我们联系
同时这个网站还有其他有趣好玩的分享，比如最佳调色板生成器（选择完美的色彩方案是任何网站或项目的关键部分，为了帮助您找寻完美的颜色组合，我们已将今天最佳的调色板生成器和网络工具收集在一起编成列表），终极指南免费库存照片（每个网站都需要很好的创造力，所以我们将最喜爱的可获得免版税图库照片的地方汇集做成特赞的列表。没错，全部是魅力图库图片，100%免费），如何根据颜色搜索图片（搜索与您的颜色方案相匹配的图片可能会相当耗时，所以我们把最爱的图片搜索工具列成了一个简短的清单，这些工具可以使用颜色对其搜索结果加以过滤或完善）等等
最后说一遍，这个网站有中文，有中文，有中文
网址分享，打开馨客栈导航：http://www.mackxin.com/nav.html
然后找到下图所示：
在线HTML颜色代码
更多分享，请关注馨客栈
关注分享，体验乐趣
*请认真填写需求信息，我们会在24小时内与您取得联系。
