CSS と VueJs は初めてなので、機能を備えたタブ パネルのデザインを作成しています
現在、tailwind CSS プラグインを使用しています
私が欲しいデザインは次のようなものです:
現在: CodePen
欠落しているため、このウィッシュをコピーできません:
flex space-x-10
grid Grid-gap-20
<nav>
bg-gray-600
次のコマンドを使用して、CSS でナビゲーションを直接変更できます。
次のコマンドを使用して、CSS でナビゲーションを直接変更できます。
ナビ{ width: max-content; /*これは固定幅を設定します、それは必要です*/ ディスプレイ: フレックス; gap: 20px; /*テンプレートと同じように増やしたいだけ増やしてください。これは、フレックス内の要素間のスペースです*/ 背景: #ccc; /*色を直接入力するだけ*/ border-radius: 20px; /*半径を入力するだけ*/; }