PHP Lang
  1. PHP Lang
  3. Выравнивание ларавелла неправильно вызвано несколькими встроенными css и внешними css в одном файле клипа
Intereting Posts
file_get_contents (- Исправить относительные URL-адреса Изменение таблицы MySQL на разных страницах с оценками из HTML-формы Сброс выходного буфера в настройке Apache / Nginx Как заменить функции MySQL PDO? Неустранимая ошибка: Class 'Symfony \ Component \ Console \ Input \ ArgvInput' не найден в приложении / консоли в строке 16 Пользовательский репозиторий Doctrine с формой objectselect PHP preg_split: разделите строку другими строками PDO – добавление большого массива в базу данных MySQL Как использовать мониторы в PHP? Передать параметр из формы в контроллер Laravel Symfony2 – Пользовательский валидатор и зависимость почему эта синтаксическая ошибка возвращает HTTP-ошибку 500, когда включен «display_errors»? Symfony 1.4 Session vs $ _SESSION Проблемы Синтаксис PHP для результата функции разыменования PHP-код для извлечения обложки через Spotify API

Выравнивание ларавелла неправильно вызвано несколькими встроенными css и внешними css в одном файле клипа

Я использую laravel в качестве моей структуры, я столкнулся с проблемой, которая является i @extends php в другой php, она отлично работает. Но я не уверен, почему макет станет странным при завершении загрузки страницы.

Это мой код 

@extends('layouts.cal') <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Laravel</title> <!-- Fonts --> <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css" rel='stylesheet' type='text/css'> <link href="https://fonts.googleapis.com/css?family=Lato:100,300,400,700" rel='stylesheet' type='text/css'> <!-- Styles --> {{-- <link href="{{ elixir('css/app.css') }}" rel="stylesheet"> --}} <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> <style> body { font-family: 'Lato'; } .fa-btn { margin-right: 6px; } </style> </head> <body id="app-layout"> <nav class="navbar navbar-default"> <div class="container"> <div class="navbar-header"> <!-- Collapsed Hamburger --> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#spark-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> <!-- Branding Image --> <a class="navbar-brand" href="{{ url('/') }}"> Laravel </a> </div> <div class="collapse navbar-collapse" id="spark-navbar-collapse"> <!-- Left Side Of Navbar --> <ul class="nav navbar-nav"> <li><a href="{{ url('/') }}">Home</a></li> </ul> <!-- Right Side Of Navbar --> <ul class="nav navbar-nav navbar-right"> <!-- Authentication Links --> @if (Auth::guest()) <li><a href="{{ url('/login') }}">Login</a></li> <li><a href="{{ url('/register') }}">Register</a></li> @else <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"> {{ Auth::user()->name }} <span class="caret"></span> </a> <ul class="dropdown-menu" role="menu"> <li><a href="{{ url('/logout') }}"><i class="fa fa-btn fa-sign-out"></i>Logout</a></li> </ul> </li> @section('content1') <div id="calendar"></div> @endsection @endif </ul> </div> </div> </nav> @yield('content') <!-- JavaScripts --> {{-- <script src="{{ elixir('js/app.js') }}"></script> --}} <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> </body> </html>

Мой cal.blade.php 

 <!DOCTYPE html> <html> <head> <meta charset='utf-8' /> <link rel='stylesheet' href='css/lib/cupertino/jquery-ui.min.css' /> <link href='css/fullcalendar.css' rel='stylesheet' /> <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css" rel='stylesheet' type='text/css'> <link href="https://fonts.googleapis.com/css?family=Lato:100,300,400,700" rel='stylesheet' type='text/css'> <!-- Styles --> {{-- <link href="{{ elixir('css/app.css') }}" rel="stylesheet"> --}} <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> {{--<link href='css/fullcalendar.print.css' rel='stylesheet' media='print' />--}} <link rel='stylesheet' href='css/lib/cupertino/jquery-ui.min.css' /> <link href='css/fullcalendar.css' rel='stylesheet' /> {{--<link href='css/fullcalendar.print.css' rel='stylesheet' media='print' />--}} <script src='js/lib/moment.min.js'></script> <script src='js/lib/jquery.min.js'></script> <script src='js/fullcalendar.min.js'></script> <script> $(document).ready(function() { $('#calendar').fullCalendar({ theme: true, header: { left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, dayClick: function(date, allDay, jsEvent, view) { $("#eventdata").show(); $("#eventdata").load("/events/add/"+allDay+"/"+$.fullCalendar.formatRange( date, 'dd/MM/yyyy/HH/mm')); }, }); }); </script> <style> body { margin: 40px 10px; padding: 0; font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif; font-size: 14px; } #calendar { max-width: 900px; margin: 0 auto; } </style> </head> <body> @yield('content1') </body> </html>

Что я добавил? 

 @extends('layouts.cal')

И в выражении if else я добавляю 

 @section('content1') <div id="calendar"></div> @endsection

Функция работает нормально, я просто не знаю, в чем проблема, почему макет изменится, когда страница загружается. Страница Laravel

Я попробовал этот метод. 

 @extends('layouts.cal') @section('content') //my code here @if (Auth::guest()) <li><a href="{{ url('/login') }}">Login</a></li> <li><a href="{{ url('/register') }}">Register</a></li> @else <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"> {{ Auth::user()->name }} <span class="caret"></span> </a> <ul class="dropdown-menu" role="menu"> <li><a href="{{ url('/logout') }}"><i class="fa fa-btn fa-sign-out"></i>Logout</a></li> </ul> </li> @section('content1') <div id="calendar"></div> @endsection @endif @endsection

Он по-прежнему работает, но проблема в том, что панель навигации на странице исчезнет, ​​когда пользователь не войдет в систему.

После изменения cal.blade.php 

 <!DOCTYPE html> <html> <head> <meta charset='utf-8' /> <link rel='stylesheet' href='css/lib/cupertino/jquery-ui.min.css' /> <link href='css/fullcalendar.css' rel='stylesheet' /> <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css" rel='stylesheet' type='text/css'> <link href="https://fonts.googleapis.com/css?family=Lato:100,300,400,700" rel='stylesheet' type='text/css'> <!-- Styles --> {{-- <link href="{{ elixir('css/app.css') }}" rel="stylesheet"> --}} <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> {{--<link href='css/fullcalendar.print.css' rel='stylesheet' media='print' />--}} <link rel='stylesheet' href='css/lib/cupertino/jquery-ui.min.css' /> <link href='css/fullcalendar.css' rel='stylesheet' /> {{--<link href='css/fullcalendar.print.css' rel='stylesheet' media='print' />--}} <style> body { margin: 40px 10px; padding: 0; font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif; font-size: 14px; } #calendar { max-width: 900px; margin: 0 auto; } </style> </head> <body> <script src='js/lib/moment.min.js'></script> <script src='js/lib/jquery.min.js'></script> <script src='js/fullcalendar.min.js'></script> <script> $(document).ready(function() { $('#calendar').fullCalendar({ theme: true, header: { left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, dayClick: function(date, allDay, jsEvent, view) { $("#eventdata").show(); $("#eventdata").load("/events/add/"+allDay+"/"+$.fullCalendar.formatRange( date, 'dd/MM/yyyy/HH/mm')); }, }); }); </script> @yield('main_add_js') </body> </html>

Related of "Выравнивание ларавелла неправильно вызвано несколькими встроенными css и внешними css в одном файле клипа"