如何创建图中所示的形状背景

Question

我想在html页面的右上角创建一个颜色＃F74422的背景。

Answer 1

试试这个

.content {
	width: 300px;
	height: 300px;
	background-color:#000;
	position: relative;
}
.content:before {
	content: '';
	width: 30px;
	height: 30px;
	position: absolute;
	right: 0;
	top: 0;
	background: #F74422 ;
	border-bottom-left-radius: 30px;
 }

<div class="content">
	</div>

Answer 2

您可以尝试以下代码。这将隐藏圆圈的其余部分，通过给圆圈顶部和右侧的负值，并使用rem值，边距将响应

＆＃13;

＆＃13;

.circle {
  width: 150px;
  height: 150px;
  float: right;
  margin-top: -5rem;
  margin-right: -5rem;
  background-color: #F74422;
  border-radius: 75px;
}

＆＃13;

<div class="circle"></div>

<h1>Hello World</h1>

＆＃13;

＆＃13;

＆＃13;