这实现思路其实很简单

需求:
1. 图片比原来的<div>大,需要切割图片。
2. 图片左上角显示标签

解决思路:

1. 把照片设置成div的backgroundImage,然后用CSS3切割图片。

.gobalPostImgHeaderCentered {
display: inline-block;
width: 170px;
height: 130px;
background-position: center center;
background-size: cover;
}

2. 把小标签的Position设置在母DIV的左上角

.gobalPostImgTag {
background-color: #262626;
color: #ffffff;
width: 45px;
height: 22px;
position: absolute;
top:;
left:;
text-align: center;
}

ImageTag,图片左上侧有一个小标签的更多相关文章

  1. 3月题外:关于JS实现图片缩略图效果的一个小问题

    由于3月可能要结束实习,所以应该不会有特别固定的主题,另外我会在月初陆续补上上个月的番外篇Projection和TMS,作为介绍性的内容对矢量切片部分进行补充,剩下时间不定期写一些杂烩. 最近两天在做 ...

  2. wxPython缩放图片控件的一个小例子

    前几天写程序的时候,想有个自适应的图片控件,但是一直没有找到合适的解决方案.今天终于解决了这个问题,发在这里,以供参考. 程序截图: 文件下载地址: http://files.cnblogs.com/ ...

  3. 用struts2标签如何从数据库获取数据并在查询页面显示。最近做一个小项目,需要用到struts2标签从数据库查询数据,并且用迭代器iterator标签在查询页面显示,可是一开始,怎么也获取不到数据,想了许久,最后发现,是自己少定义了一个变量,也就是var变量。

    最近做一个小项目,需要用到struts2标签从数据库查询数据,并且用迭代器iterator标签在查询页面显示,可是一开始,怎么也获取不到数据,想了许久,最后发现,是自己少定义了一个变量,也就是var变 ...

  4. Pygame:编写一个小游戏 标签: pythonpygame游戏 2017-06-20 15:06 103人阅读 评论(0)

    大学最后的考试终于结束了,迎来了暑假和大四的漫长的"自由"假期.当然要自己好好"玩玩"了. 我最近在学习Python,本意是在机器学习深度学习上使用Python ...

  5. 前端开发HTML&css入门——常用的标签以及一个小练习

    meta标签 <!doctype html> <html> <head> <meta charset="utf-8" /> < ...

  6. 关于H标签 DL DT DD标签的一个小故事

    看了一篇关于SEO论坛的论文,大概故事内容是:一个专业的销售公司,里面SEO  技术多多,可就是销售网站的SEO的情况极为恼火.这天,老板又招到了一个SEO,直接聘为SEO主管全权负责网站的SEO,并 ...

  7. Slog71_选取、上传和显示本地图片GET !(微信小程序之云开发-全栈时代3)

    ArthurSlog SLog-71 Year·1 Guangzhou·China Sep 12th 2018 ArthurSlog Page GitHub NPM Package Page 掘金主页 ...

  8. Redola.Rpc 的一个小目标

    Redola.Rpc 的一个小目标 Redola.Rpc 的一个小目标:20000 tps. Concurrency level: 8 threads Complete requests: 20000 ...

  9. UniversalImageLoader的一个小问题

    最近在使用UniversalImageLoader时遇到了一个小问题,多个地方同时通过ImageLoader.getInstance().loadImage(url, new ImageSize(dp ...

随机推荐

  1. ExcelPackage导入导出,命名空间一定要是EPPlus

    1.引入EPPlus.dll,旧版的是OfficeOpenXml.dll,最好使用EPPlus2.调用 string path = UploadExecl(batchUpload.BinaryExce ...

  2. linux下操作oracle

    ps -ef|grep ora #查看oracle状态 lsnrctl status #查看监听的状态 lsnrctl start |stop |reload #启动|停止|重启 监听 登录oracl ...

  3. Java的包装类

    一.概述 因为基本数据类型的变量身上没有任何的方法和属性,所以针对基本数据类型提供了对应的类形式--包装类. 利用这个类产生对象,调用对象身上的方法来操作这个数据. 二.分类 包装类分为以下几种: 基 ...

  4. Day 16:输入输出字符流、缓冲输入字符流

    输入输出字节流输出字符时的常见问题 import java.io.File; import java.io.FileInputStream; import java.io.FileOutputStre ...

  5. springmvc(@ResponseBody)无法跳转到对应的jsp页面

    项目框架:spring+springmvc+mybatis 问题描述:Controller返回jsp页面名称后,前端无法跳转到该页面,而是将该jsp名称打印到前端页面 前端异常信息:无 后端异常信息: ...

  6. DW1000芯片定位技术解析

    近些年来随着物联网和机器人技术的大发展,精确定位技术的热度也随之攀升.目前精确定位的技术有很多,如基于wifi.RFID.zigbee.超声波.UWB等技术都可以实现精准定位.由于技术的不同,精度也不 ...

  7. JS图片多个上传,并压缩为Base64

    首先是JS 批量上传 HTML <div id="Pic_pass"> <p style="font-size: 20px;font-weight: b ...

  8. Java TCP发送与接收

    IP地址?端口号?主机名? 什么是Socket? 什么是UDP? 什么是TCP? UDP和TCP区别? 以上问题请自行百度,有标准解释,此处不再赘述,直接上干货! 实例: 发送端: public cl ...

  9. 《新标准C++程序设计》2.1-2.3(C++学习笔记3)

    1.结构化程序设计的不足 程序=算法+数据结构 数据结构和变量相对应,算法和函数相对应,算法是用来操作数据结构的. 结构化程序设计中,函数和其所操作的数据结构,没有直观的联系.随着程序规模的增加,程序 ...

  10. HandyJSON.Metadata.Class Xcode10.2, swift5.0 报错 linker command failed with exit code 1

    https://blog.csdn.net/weiwandaixu_/article/details/88842491 2019年03月27日 13:35:40 一如初夏丿 阅读数:31 标签: li ...