【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>
相关推荐
初学小白...5 分钟前
HTML知识点
前端·javascript·html
鹏多多7 分钟前
flutter睡眠与冥想数据可视化神器:sleep_stage_chart插件全解析
android·前端·flutter
艾小码17 分钟前
Vue3 脚本革命:<script setup> 让你的代码简洁到飞起!
前端·javascript·vue.js
IT_陈寒32 分钟前
Python 3.12新特性解析:10个让你代码效率提升30%的实用技巧
前端·人工智能·后端
故厶1 小时前
webpack实战
前端·javascript·webpack
_果果然1 小时前
你真的懂递归吗?没那么复杂,但也没那么简单
前端·javascript
菜泡泡@2 小时前
仓库地图vue-grid-layout
前端·javascript·vue.js
u***u6854 小时前
React环境
前端·react.js·前端框架
X***E4634 小时前
前端数据分析应用
前端·数据挖掘·数据分析
4***14904 小时前
React社区
前端·react.js·前端框架