tailwind自适应页面布局效果-html代码-BFW代码库

tailwind自适应页面布局效果

代码语言：html

代码描述：tailwind自适应页面布局效果

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="http://repo.bfw.wiki/bfwrepo/css/tailwind.min.css">
<style>
@import url('https://fonts.googleapis.com/css2?family=Muli:ital,wght@0,400;0,900;1,500&display=swap');


body {
  font-family: "Muli";
}
</style>

</head>
<body translate="no">
<div class="flex flex-wrap">
<div class="w-full sm:w-8/12 mb-10">
<div class="container mx-auto h-full sm:p-10">
<nav class="flex px-4 justify-between items-center">
<div class="text-4xl font-bold">
Plant<span class="text-green-700">.</span>
</div>
<div>
    

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 469.333 469.333" style="enable-background:new 0 0 469.333 469.333;" xml:space="preserve" class="w-8">
<g>
	<g>
		<path d="M468.523,6.592C466.88,2.603,462.976,0,458.667,0C44.694,0,0,171.563,0,245.333c0,26.539,5.888,51.328,17.515,73.664
			c1.792,3.456,5.333,5.653,9.216,5.739c3.669-0.107,7.531-1.941,9.472-5.333C64.15,271.104,143.296,151.893,274.006,88.555
			c5.355-2.56,11.755-0.363,14.293,4.907c2.56,5.312,0.341,11.712-4.949,14.272c-9.856,4.779-19.328,9.984-28.608,15.381
			c-3.541,2.069-6.976,4.267-10.453,6.421c-5.227,3.243-10.389,6.549-15.424,9.963c-5.013,3.371-9.963,6.827-14.827,10.368
			c-1.515,1.109-2.965,2.24-4..........完整代码请登录后点击上方下载按钮下载查看