CSS3圆角、rgba显示

最新推荐文章于 2023-02-22 20:31:20 发布

a_Joker_Ling

最新推荐文章于 2023-02-22 20:31:20 发布

阅读量199

点赞数

分类专栏： CSS Html 文章标签： css html css3 shader js

本文链接：https://blog.csdn.net/a1209849629/article/details/105468518

版权

本文介绍了CSS3中的圆角属性如何设置，包括单个角的圆角、椭圆角以及整个边框的圆角。此外，还探讨了rgba颜色值表示法，用于实现盒子的透明效果。

摘要由CSDN通过智能技术生成

CSS3圆角、rgba

CSS3圆角

设置某一个角的圆角，比如设置左上角的圆角：
border-top-left-radius:30px 60px; 此时为椭圆角
border-top-left-radius:30px; 此时为正圆角
同时分别设置四个角： border-radius:30px 60px 120px 150px; 此时为正圆角。

设置四个圆角相同：
border-radius:50%;

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
		
		.box{
    
			width:300px;
			height:300px;
			border:3px solid #000;
			background-color:gold;
			margin:50px auto 0;
			border-top-left-radius:60px;
			border-top-right-radius<