html表格中加背景图片,关于在HTML表格中插入背景图片图片重复显示的问题

先来一段有问题的代码(其实也不能说是有问题，毕竟语法上是没问题的，只是出来的效果不是我们想要的——我们假设预期的效果是背景图片只填充一次而不是多次。)

设定表格的背景图像

姓名	张三
性别	男
年龄	20

页面效果是：

我们稍微修改一下

标签的属性就可以让图片只出现一次——

通过style属性来设置背景图片，而不是直接设置background属性，

代码如下：

设定表格的背景图像

姓名	张三
性别	男
年龄	20

页面效果是：

其中，关键点在于后面的值的设置。除了"no-repeat"这个使图片不重

复的值，还有以下几个值可选：

repeat: 平铺整个页面,左右与上下

repeat-x: 在x轴上平铺,左右

repeat-y: 在y轴上平铺,上下

no-repeat: 图片不重复

inherit: 继承

具体效果请大家自测！

另外，我们大家平时可能经常需要在表格的单元格内添加图片。除了和上面一样添加图片作为背景外，我们更常用的可能是把图片作为一个元素添加，代码如下：

设定表格的背景图像

姓名	张三
性别	男
年龄	20
头像

页面效果是：

PS：别问我为什么这人的头那么胖，我只想说：以这种方式添加的

图片，宽(width)高(height)值可以任意设置(当然也可以不设置，那

样就是默认大小)。

html表格中加背景图片,关于在HTML表格中插入背景图片图片重复显示的问题相关推荐

php网页中不能上传图片,为什么我的PHP图片上传代码可以实现插入数据库但图片不能插入文件夹中？...
为什么我的PHP图片上传代码可以实现插入数据库但图片不能插入文件夹中? 关注:167 答案:4 mip版解决时间 2021-01-19 00:58 提问者慢慢学会遗忘 2021-01-18 00 ...
在php代码中加视频,php – 如何在laravel代码中嵌入视频
我正在开发一个项目,我将youtube视频链接存储在数据库中,然后我检索这些链接并使用刀片模板引擎我尝试将它们嵌入到页面中.我使用循环将视频放在页面中.出于某种原因,我没有在浏览器中收到任何视频.它覆 ...
怎样使表格中的数字自动计算机,#怎样让一个表格自动加或乘#如何使excel表格里多个数同时除以1000？...
excel 每个单元格数字都除以1000 怎么设置单元格急求!!! 在一空白单元格输入1000-复制该单元格-右键需转化区域-选择性粘贴-下面选除-确定如何使excel表格里多个数同时除以1000 ...
elementui 表格英文加数字排序_解决vue elementUI中table里数字、字母、中文混合排序问题...
1.使用场景使用elementUI中的table时,给包含数字字母中文的名称等字段排序例如:数字(0->9)->大写字母(A->Z)->小写字母(a->z)-> ...
在linux中加用户,Ubuntu使用教程——在Ubuntu中添加用户
Ubuntu是一个多用户操作系统.多用户操作系统意味着多个用户可以通过独立的.个人的HOME文件夹,文件和设置访问计算机.用户A可以登录并修改他/她自己的配置文件而不会影响用户B的配置文件. 因此,你 ...
html中加一个空行,浅谈HTML代码中的空格和空行
HTML 代码中的所有连续的空格或空行(换行)都会被显示为一个空格. 例子1:(文本内容中的连续空格) 代码 XML/HTML Code复制内容到剪贴板这段文本中,输入连续的空格 ...
html中加多个空格,如何在HTML中插入空格
通常情况下,我们用空格键来打出多个空格,而在编写代码时,通过空格键.Tab键以及回车键打出的空格,都会被HTML(超文本标记语言)自动忽略.HTML将这样的键视为空白字符,并显示为单个空白间隔.尽管C ...
在Spring Boot中加载初始化数据
文章目录依赖条件 data.sql文件 schema.sql 文件 @sql注解 @SqlConfig 注解在Spring Boot中加载初始化数据在Spring Boot中,Spring Bo ...
word怎么在下一页添加表头_简单！用2个小妙招，让Word跨页表格自动加表头！
原标题:简单!用2个小妙招,让Word跨页表格自动加表头! 对于一些大型表格,往往会分多页显示,这就导致一个问题出现,当表格延伸到下一页之后,因为没有了表头(标题行),不阅读起来十分不方便. 因此,今 ...
在C++中加载TorchScript模型
在C++中加载TorchScript模型本教程已更新为可与PyTorch 1.2一起使用顾名思义,PyTorch的主要接口是Python编程语言.尽管Python是合适于许多需要动态性和易于迭代的 ...

html表格中加背景图片,关于在HTML表格中插入背景图片图片重复显示的问题

html表格中加背景图片,关于在HTML表格中插入背景图片图片重复显示的问题相关推荐

最新文章

热门文章