laravel 创建基础布局
2018年8月31日1.创建文件
|
1 2 3 4 |
mkdir -p resources/views/layouts/ touch resources/views/layouts/app.blade.php touch resources/views/layouts/_header.blade.php touch resources/views/layouts/_footer.blade.php |
2. 编写app
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="csrf-token" content="{{ csrf_token() }}"> <title>@yield('title', 'Laravel') - Laravel </title> <!-- 样式 --> <link href="{{ mix('css/app.css') }}" rel="stylesheet"> </head> <body> <div id="app" class="{{ route_class() }}-page"> @include('layouts._header') <div class="container"> @yield('content') </div> @include('layouts._footer') </div> <!-- JS 脚本 --> <script src="{{ mix('js/app.js') }}"></script> </body> </html> |
2编写 head
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
<nav class="navbar navbar-default navbar-static-top"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#app-navbar-collapse"> <span class="sr-only">Toggle Navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="{{ url('/') }}"> Laravel </a> </div> <div class="collapse navbar-collapse" id="app-navbar-collapse"> <ul class="nav navbar-nav"> </ul> <ul class="nav navbar-nav navbar-right"> <li><a href="#">登录</a></li> <li><a href="#">注册</a></li> </ul> </div> </div> </nav> |
4.编写footer
|
1 2 3 4 5 6 7 8 9 |
<footer class="footer"> <div class="container"> <p class="pull-left"> 介绍介绍 </p> <p class="pull-right"><a href="">联系我们</a></p> </div> </footer> |
