html的img标签repeat,border-image-repeat属性怎么用
border-image-repeat属性是用于指定图像边框是否应被重复(repeated)、拉伸(stretched)或铺满(rounded)的。
CSS3 border-image-repeat属性
作用:规定图像边框是否应该被重复(repeated)、拉伸(stretched)或铺满(rounded)。
语法:border-image-repeat: stretch|repeat|round|space;
stretch:表示拉伸图像来填充区域
repeat:表示平铺(重复)图像来填充区域。
round:类似 repeat 值;如果无法完整平铺所有图像,则对图像进行缩放以适应区域。
space:类似 repeat 值。如果无法完整平铺所有图像,扩展空间会分布在图像周围
说明:border-image-repeat属性规定如何延展和铺排边框图像的边缘和中间部分。因此,您可以规定两个值。如果省略第二个值,则采取与第一个值相同的值。
注: Internet Explorer 10, Opera 12 和 Safari 5 不支持 border-image-repeat 属性。
CSS3 border-image-repeat属性的使用示例
div {
margin:50px;
border: 30px solid transparent;
border-image: url('https://img.php.cn/upload/article/000/000/024/5c62637b1a4fe853.png');
border-image-slice: 25;
}
.round{
border-image-repeat: round;
}
.repeat{
border-image-repeat: repeat;
}
.stretc{
border-image-repeat: stretc;
}
DIV 使用图像边框--round
DIV 使用图像边框--repeat
DIV 使用图像边框--stretc
效果图:
html的img标签repeat,border-image-repeat属性怎么用相关推荐
- html 图片repeat,html中repeat技术分享
backgroundrepeat 属性 主体内容,如何在水平方向重复背景图像. CSS里的 no-repeat 是什么意思 html background-repeat:no-repeat; < ...
- HTML img 标签的 border 属性
定义和用法 <img> 标签的 border 属性规定图像周围的边框的宽度,就是说可以增加或去掉图像的边框. 注释:默认地,图像是没有边框的(除非图像在 a 元素内部). 浏览器通常会把代 ...
- jQuery对象,jQuery查找标签,层级选择器,属性选择器,表单筛选器,操作节点标签事件...
目录 jQuery jQuery介绍 jQuery的优势 jQuery版本 jQuery内容: jQuery对象 jQuery基础语法 查找标签 基本选择器 层级选择器: 基本筛选器: 属性选择器 表 ...
- 前端JavaScript DOM BOM 自学复盘 D1(DOM-获取DOM元素、修改HTML标签/表单/css样式属性、定时器-间歇函数)
内容概要 1. Web API 基本认知 1.1. 作用和分类 1.2. 什么是DOM 1.3. DOM作用 1.4 DOM树 1.4.1. DOM树是什么? 1.4.2. DOM 树的作用 1.5 ...
- Vue中的style标签的lang=“ “和scpoed属性
Vue中的style 的lang=" "和scpoed属性 普通的 style 标签只支持普通的样式,如果想要启用 scss 或 less ,需要为 style 元素,设置 lan ...
- HTML5 script 标签的 crossorigin 和integrity属性的作用
Bootstrap 4 依赖的基础库中出现了两个新的属性 1 <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.slim ...
- ueditor html显示图片,百度ueditor编辑器上传图片后img标签的title、alt属性优化简单方法...
<百度ueditor编辑器上传图片后img标签的title.alt属性优化简单方法>要点: 本文介绍了百度ueditor编辑器上传图片后img标签的title.alt属性优化简单方法,希望 ...
- 在Asp.Net MVC中实现RequiredIf标签对Model中的属性进行验证
在Asp.Net MVC中可以用继承ValidationAttribute的方式,自定制实现RequiredIf标签对Model中的属性进行验证 具体场景为:某一属性是否允许为null的验证,要根据另 ...
- html css integrity,HTML5 script 标签的 crossorigin 和integrity属性的作用
Bootstrap 4 依赖的基础库中出现了两个新的属性 1 2 3 HTML5 新的规定,是可以允许本地获取到跨域脚本的错误信息,但有两个条件:一是跨域脚本的服务器必须通过 Access-Contr ...
- log4j2.xml 的标签 loggers 中 root 的属性 level 指的是什么
log4j2.xml 的标签 loggers 中 root 的属性 level 指的是什么 log4j2.xml 是 log4j2 中的其中一种配置文件.log4j2.xml 中往往有如下配置: ...
最新文章
- python循环队列_关于循环队列的一些讲解
- jquery ajax 样例
- tango with django(第三章 Django基础)
- 124angular1实现无限表单(仅供自己看)
- 算法一看就懂之「 堆栈 」
- Jquery+asp.net实现Ajax方式文件下载实例代码
- logstash增量读取mysql中的数据到es中
- STM32打印log--使用J-Link RTT Viewer
- 关于setTimeout的面试题
- 统计学之算术平均数、调和平均数、几何平均数、位置平均数详解
- 雷电9模拟器安装抓包工具whistle证书
- ADF Faces Core 标记库信息
- YOLOv7移植经验分享
- 基于Matlab的多线激光中心坐标值提取
- 模拟看门狗如何实现?
- Scala 获取时间,时间戳,时间差
- 转:MSN君最后的十个瞬间
- IBM-142-XML认证
- Office文档背景变成黑色 - 解决方案
- python中fit_Python sklearn中的.fit与.predict的用法说明
热门文章
- 信息安全 数据赛 铁人三项_[信息安全铁人三项赛总决赛](数据赛)第二题
- 斐讯k3搭建nginx+php+MariaDB(mysql )的教程
- dom4j解析dom示例
- cancase vector_低價替代Vector CANoe CAN總線適配解決方案支持所有USBCAN(周立功CAN、PCAN、Kvaser、ValueCAN、NI CAN)...
- English Learning - L3 综合练习 1 VOA-Color 2023.04.26 周三
- 推荐一个好的博客下载工具
- Tomcat 的下载与安装教程
- 使用python将doc的word文件转换成docx文件
- Shell中判断字符串是否为数字的6种方法
- [单片机框架] [kv_sys] 实现一个简易KV键值系统(最终版)