Laravel make：auth css stylesheet

我做了認證示例頁面php artisan make：auth。 example page如果我在CSS樣式表進行更改沒有發生。頁面看起來一直都是一樣的。 Css樣式表位於\ public \ css文件夾中。Laravel make：auth css stylesheet

app.blade.php

<!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"> 

<!-- CSRF Token --> 
<meta name="csrf-token" content="{{ csrf_token() }}"> 

<title>{{ config('app.name', 'Laravel') }}</title> 

<!-- Styles --> 
<link rel="stylesheet" href="{{ URL::asset('/css/app.css') }}"> 

<!-- Scripts --> 
<script> 
    window.Laravel = <?php echo json_encode([ 
     'csrfToken' => csrf_token(), 
    ]); ?> 
</script> 
</head> 
<body> 
<div id="app"> 
    <nav class="navbar navbar-default navbar-static-top"> 
     <div class="container"> 
      <div class="navbar-header"> 

    <!-- Collapsed Hamburger --> 
       <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> 

       <!-- Branding Image --> 
       <a class="navbar-brand" href="{{ url('/') }}"> 
        {{ config('app.name', 'Laravel') }} 
       </a> 
      </div> 

      <div class="collapse navbar-collapse" id="app-navbar-collapse"> 
       <!-- Left Side Of Navbar --> 
       <ul class="nav navbar-nav"> 
        &nbsp; 
       </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') }}" 
             onclick="event.preventDefault(); 
               document.getElementById('logout-form').submit();"> 
             Logout 
            </a> 

            <form id="logout-form" action="{{ url('/logout') }}" method="POST" style="display: none;"> 
             {{ csrf_field() }} 
            </form> 
           </li> 
          </ul> 
         </li> 
        @endif 
       </ul> 
      </div> 
     </div> 
    </nav> 

    @yield('content') 
</div> 

<!-- Scripts --> 
<script src="/js/app.js"></script> 
</body> 
</html>

app.css是空白

app.scss

// Fonts 
@import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600); 

// Variables 
@import "variables"; 

// Bootstrap 
@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap";

_variables.scss

// Body 
$body-bg: #f5f8fa; 

// Borders 
$laravel-border-color: darken($body-bg, 10%); 
$list-group-border: $laravel-border-color; 
$navbar-default-border: $laravel-border-color; 
$panel-default-border: $laravel-border-color; 
$panel-inner-border: $laravel-border-color; 

// Brands 
$brand-primary: #3097D1; 
$brand-info: #8eb4cb; 
$brand-success: #2ab27b; 
$brand-warning: #cbb956; 
$brand-danger: #bf5329; 

// Typography 
$font-family-sans-serif: "Raleway", sans-serif; 
$font-size-base: 14px; 
$line-height-base: 1.6; 
$text-color: #636b6f; 

// Navbar 
$navbar-default-bg: #fff; 

// Buttons 
$btn-default-color: $text-color; 

// Inputs 
$input-border: lighten($text-color, 40%); 
$input-border-focus: lighten($brand-primary, 25%); 
$input-color-placeholder: lighten($text-color, 30%); 

// Panels 
$panel-default-heading-bg: #fff;

來源

2016-12-04 asapa

我們需要看你的代碼來找出問題的原因 – Birdman

@Birdman好的我添加了代碼，但這是由php artisan生成的簡單代碼：auth命令 – asapa

我不知道如果你正在談論編輯app.css文件或新的自定義文件。

如果app.css得到由預處理器（通常shoudn't），你可以隨時在public/css/my-styles.css創建一個新的CSS文件，並在您的視圖加載覆蓋：

<!-- Styles --> 
<link rel="stylesheet" href="{{ URL::asset('/css/app.css') }}"> 
<link rel="stylesheet" href="{{ URL::asset('/css/my-styles.css') }}">

確保使用更大的特異性根據你的css規則覆蓋任何預定義的設置，或者當你也有使用!important時。

同時清除瀏覽器的緩存（或使用私人模式，如Chrome的隱身模式）將確保您看到您當前的CSS設置，而不是一些緩存的內容。

來源

2016-12-04 00:58:54 LePhleg

感謝您的幫助。清除瀏覽器的緩存幫助。 – asapa

緩存有時候是一種痛苦。很高興我幫助過！ – LePhleg

Laravel make：auth css stylesheet

回答

相關問題