라라벨/laravel7스터디
tailwindcss cdn 적용
땀모
2020. 3. 28. 11:26
1. welcome.blade.php <head>안에 삽입</head>
<!-- TailWindCss -->
<link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet">
2. body 중앙정렬한다.
sidebar컴포넌트 배경을 그레이500으로 적용한다.
<body class="flex flex-col items-center">
<x-sidebar title="My Sidebar" :info="$info" class="bg-gray-500"/>
</body>
3. div에 $attributes를 넘겨줘야 적용이된다.
<div {{$attributes}}>
<h1>{{ $title }}</h1>
<h3>{{ $info }}</h3>
Hello Laravel 7 Component<br>
@foreach($list('저는 리스트 매개변수입니다') as $item)
<ul>
{{ $item }}
</ul>
@endforeach
</div>
결과
4. div에 텍스트 크기 정의하기
<div {{$attributes->merge(['class' => 'text-xl'])}}>
<h1>{{ $title }}</h1>
<h3>{{ $info }}</h3>
<p class="text-pink-200">Hello Laravel 7 Component</p>
@foreach($list('저는 리스트 매개변수입니다') as $item)
<ul>
{{ $item }}
</ul>
@endforeach
</div>
결과
