简约几何上下图文带标题

源代码

<section style="width: 96%;margin-right: auto;margin-left: auto;"><section style="display: flex;justify-content: flex-start;"><section style="width: 50px;height: 1px;margin-right: 10px;background-color: #3587bf;transform-origin: left center;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg);"></section></section><section style="display: flex;justify-content: flex-end;align-items: center;"><section style="width: 10px;height: 10px;background-color: #3587bf;transform: rotate3d(0, 0, 1, -45deg);-webkit-transform: rotate3d(0, 0, 1, -45deg);-moz-transform: rotate3d(0, 0, 1, -45deg);-ms-transform: rotate3d(0, 0, 1, -45deg);-o-transform: rotate3d(0, 0, 1, -45deg);"></section><section style="margin-right: 10px;margin-left: 10px;"><p style="min-width: 1px;font-size: 17px;font-weight: bold;color: #3587bf;">                输入标题</p></section><section style="width: 10px;height: 10px;background-color: #3587bf;transform: rotate3d(0, 0, 1, -45deg);-webkit-transform: rotate3d(0, 0, 1, -45deg);-moz-transform: rotate3d(0, 0, 1, -45deg);-ms-transform: rotate3d(0, 0, 1, -45deg);-o-transform: rotate3d(0, 0, 1, -45deg);"></section></section><section style="display: flex;justify-content: space-between;"><section style="width: 54px;display: flex;align-content: center;flex-wrap: wrap;"><section style="width: 10px;height: 10px;margin: 2px;background-color: #3587bf;transform: rotate3d(0, 0, 1, -45deg);-webkit-transform: rotate3d(0, 0, 1, -45deg);-moz-transform: rotate3d(0, 0, 1, -45deg);-ms-transform: rotate3d(0, 0, 1, -45deg);-o-transform: rotate3d(0, 0, 1, -45deg);"></section><section style="width: 10px;height: 10px;margin: 2px;background-color: #3587bf;transform: rotate3d(0, 0, 1, -45deg);-webkit-transform: rotate3d(0, 0, 1, -45deg);-moz-transform: rotate3d(0, 0, 1, -45deg);-ms-transform: rotate3d(0, 0, 1, -45deg);-o-transform: rotate3d(0, 0, 1, -45deg);"></section><section style="width: 10px;height: 10px;margin: 2px;background-color: #3587bf;transform: rotate3d(0, 0, 1, -45deg);-webkit-transform: rotate3d(0, 0, 1, -45deg);-moz-transform: rotate3d(0, 0, 1, -45deg);-ms-transform: rotate3d(0, 0, 1, -45deg);-o-transform: rotate3d(0, 0, 1, -45deg);"></section><section style="width: 10px;height: 10px;margin: 2px;background-color: #3587bf;transform: rotate3d(0, 0, 1, -45deg);-webkit-transform: rotate3d(0, 0, 1, -45deg);-moz-transform: rotate3d(0, 0, 1, -45deg);-ms-transform: rotate3d(0, 0, 1, -45deg);-o-transform: rotate3d(0, 0, 1, -45deg);"></section><section style="width: 10px;height: 10px;margin: 2px;background-color: #3587bf;transform: rotate3d(0, 0, 1, -45deg);-webkit-transform: rotate3d(0, 0, 1, -45deg);-moz-transform: rotate3d(0, 0, 1, -45deg);-ms-transform: rotate3d(0, 0, 1, -45deg);-o-transform: rotate3d(0, 0, 1, -45deg);"></section><section style="width: 10px;height: 10px;margin: 2px;background-color: #3587bf;transform: rotate3d(0, 0, 1, -45deg);-webkit-transform: rotate3d(0, 0, 1, -45deg);-moz-transform: rotate3d(0, 0, 1, -45deg);-ms-transform: rotate3d(0, 0, 1, -45deg);-o-transform: rotate3d(0, 0, 1, -45deg);"></section><section style="width: 10px;height: 10px;margin: 2px;background-color: #3587bf;transform: rotate3d(0, 0, 1, -45deg);-webkit-transform: rotate3d(0, 0, 1, -45deg);-moz-transform: rotate3d(0, 0, 1, -45deg);-ms-transform: rotate3d(0, 0, 1, -45deg);-o-transform: rotate3d(0, 0, 1, -45deg);"></section><section style="width: 10px;height: 10px;margin: 2px;background-color: #3587bf;transform: rotate3d(0, 0, 1, -45deg);-webkit-transform: rotate3d(0, 0, 1, -45deg);-moz-transform: rotate3d(0, 0, 1, -45deg);-ms-transform: rotate3d(0, 0, 1, -45deg);-o-transform: rotate3d(0, 0, 1, -45deg);"></section><section style="width: 10px;height: 10px;margin: 2px;background-color: #3587bf;transform: rotate3d(0, 0, 1, -45deg);-webkit-transform: rotate3d(0, 0, 1, -45deg);-moz-transform: rotate3d(0, 0, 1, -45deg);-ms-transform: rotate3d(0, 0, 1, -45deg);-o-transform: rotate3d(0, 0, 1, -45deg);"></section></section><section style="width: 80%;"><p style="min-width: 1px;font-size: 16px;color: #7f7f7f;">                我觉得这个世界美好无比。晴时满树花开，雨天一湖涟漪，阳光席卷城市，微风穿越指间，入夜每个电台播放的情歌，沿途每条山路铺开的影子，全部是你不经意写的一字一句</p></section></section><section style="width: 100%;margin-top: 12px;border-width: 1px;border-style: solid;border-color: rgb(53, 135, 191);border-radius: 3px;box-sizing: border-box;"><img src="https://cdn.file.mixinnet.cn/htmlImg/a5f230349670938138dd045308791b35.png" style="width:100%;vertical-align:top;border-radius: 3px;" data-brush="img"></section></section>

关于我们

快捷导航

联系我们

关于我们