【css】关于css样式中border-radius和border-image不兼容问题

javascript 复制代码
<div class="out">
		<div class="in">
			Log Out
		</div>
</div>

<style type="text/css">
		.out{
			margin: 0 auto 10rpx;
			width: 336rpx;
			height: 64rpx;
			box-sizing: border-box;
			border-image: linear-gradient(270deg, rgba(15, 149, 136, 1), rgba(0, 120, 178, 1)) 2 2;
			font-size: 28rpx;
			font-family: Helvetica;
			color: #0078B2;
			line-height: 64rpx;
			text-align: center;
			border-radius: 44rpx;
		}
		.in{
			width: 100%;
			height: 100%;
			border-radius: 44rpx;
			text-align: center;
			border: 2rpx solid;
		}
	</style>
相关推荐
晓得迷路了6 分钟前
栗子前端技术周刊第 84 期 - Vite v7.0 beta、Vitest 3.2、Astro 5.9...
前端·javascript·vite
独立开阀者_FwtCoder9 分钟前
最全301/302重定向指南:从SEO到实战,一篇就够了
前端·javascript·vue.js
Moment18 分钟前
给大家推荐一个超好用的 Marsview 低代码平台 🤩🤩🤩
前端·javascript·github
小满zs22 分钟前
Zustand 第三章(状态简化)
前端·react.js
普宁彭于晏24 分钟前
元素水平垂直居中的方法
前端·css·笔记·css3
恋猫de小郭35 分钟前
为什么跨平台框架可以适配鸿蒙,它们的技术原理是什么?
android·前端·flutter
云浪38 分钟前
元素变形记:CSS 缩放函数全指南
前端·css
明似水1 小时前
用 Melos 解决 Flutter Monorepo 的依赖冲突:一个真实案例
前端·javascript·flutter
独立开阀者_FwtCoder1 小时前
stagewise:让AI与代码编辑器无缝连接
前端·javascript·github
清沫1 小时前
Cursor Rules 开发实践指南
前端·ai编程·cursor