css 设置头像图片不变形

在样式中加 object-fit: cover 就可以了

css 设置头像图片不变形的更多相关文章

  1. img只显示图片一部分 或 css设置背景图片只显示图片指定区域

    17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...

  2. css 设置背景图片模糊，内容不模糊

    需求:一个div设置了background: url,现在需要使图片背景模糊,div内的文字清晰显示. 原始代码: <!DOCTYPE html> <html lang=" ...

  3. css设置背景图片，ie显示不了

    本来是想给导航栏<div class="nav"></div>添加背景图片的,设置css样式如下: .nav{background:url("ht ...

  4. （转）background-position—CSS设置背景图片的位置

    background-position :在 CSS 中通过 background-position 属性可以调整背景图片的位置.因为在默认情况下背景图片都是从设置了 background-posit ...

  5. css设置背景图片自适应

      CreateTime--2017年12月25日16:36:07 Author:Marydon 控制背景图片100%自适应填充布局 /* 控制背景图片100%自适应填充布局 */ body{ bac ...

  6. 使用CSS设置背景图片，图片比较大，完全显示在一个DIV中

    做的时候想要边框为比较好看的样式,需要UI切图并且放在div中,看起来会好看点 像这样的,我随便挑选了一个,UI帮我切图出来 需要把这个图片填到相应的div里面,但是很显然碰到一个问题,图片太大,而且 ...

  7. css 设置背景图片透明

    最终效果: 背景图片css不变,再背景图片的里层元素设置css样式即可 opacity:0.4; filter:alpha(opacity=40); /* 针对 IE8 以及更早的版本 */

  8. css设置背景图片

    background:pink;图片在背景图上面 background-image:url(food.jpg);一张图片铺满一行background-repeat:repeat-x;同一张图片多张铺满 ...

  9. css设置background图片的位置实现居中

    /* 例 1: 默认值 */ background-position: 0 0; /* 元素的左上角 */ /* 例 2: 把图片向右移动 */ background-position: 75px 0 ...

随机推荐

  1. Oracle 行列转换公式

    1.行转列 SELECT STU_NAME,TERM,ZHANBI,COURSE_MARK FROM (SELECT '罗飞' STU_NAME, '2001-2002' TERM, ' 微积分, ' ...

  2. 树莓派4B 串口通信

    提前下载安装Glade图形编辑器 参考 树莓派4B安装netcore 环境部署.发布.执行操作 准备串口设备本文使用串口控制继电器设备 如图 1.发现串口 void GetSerialPort() { ...

  3. [转帖]yum命令的使用与createrepo自建仓库教程

    yum命令的使用与createrepo自建仓库教程 http://www.linuxe.cn/post-300.html 跟上篇一样 可以学习一下. 发布:TangLu2018-11-23 16:48 ...

  4. JavaScript Let 和 Const

    来源:菜鸟教程:https://www.runoob.com/js/js-let-const.html JavaScript let 和 const ECMAScript 2015(ECMAScrip ...

  5. 小白学习tornado框架第一站-环境设置

    首先建立一个虚拟环境 mkvirtualenv -p /usr/bin/python3 tornado_1 安装tornado框架 pip install tornado  pycham中建立同步 创 ...

  6. Eclipce远程调试

    1.注意: root权限启动的进程不支持远程调试,也有很多隐患,支持最高权限,应用普通用户启动,又原先安装Tomcat是使用的root权限,普通用户对root安装的软件没有执行权限,可以修改相应权限, ...

  7. JSTL标签+El表达式把list集合数据展示到 JSP页面

    JSP页面 <%@ page import="cn.itcast.domain.User" %><%@ page import="java.util.L ...

  8. 机器学习-SVM-手写识别问题

    机器学习-SVM-手写识别问题 这里我们解决的还是之前用KNN曾经解决过的手写识别问题(https://www.cnblogs.com/jiading/p/11622019.html),但相比于KNN ...

  9. UI测试

    先是从一张图开始,让大家看看这个图里有什么不妥: 接着告诉大家具体有哪些不妥: 然后结合这个找茬的过程分享下界面测试的概念和方法. 界面测试:简称UI测试,测试功能模块界面上看到的所有元素(包括空文字 ...

  10. 进程管理工具之supervisor[详解]

    原文链接:https://blog.csdn.net/weixin_42390791/article/details/88866237 一.问题背景1.背景​   如何才能让一个进程摆脱终端,获得相对 ...