Laravel에서 CSS 클래스 사용

실톱 075

이것이 제 첫 번째 질문이라 조금 긴장됩니다. Laravel을 배우고 5.6 버전을 사용하려고합니다. themeforest.net에서 HTML 테마를 얻고 마스터 레이아웃을 빌드합니다. 다른 blade.php 파일의 머리글 및 바닥 글 코드를 포함합니다. 헤더에는 '카테고리 찾아보기'라는 메뉴가 있습니다. 홈페이지의 메뉴에는 'show'라는 CSS 클래스가 포함되어 있습니다. 그러나 다른 페이지에는 메뉴가 없어야합니다. 내 header.blade.php 파일은 다음과 같습니다.

<div class="col-md-5 order-3 order-md-2">
    <nav class="category-nav primary-nav show"><!--this is where i stuck-->
        <div>
            <a href="javascript:void(0)" class="category-trigger">
                <i class="fa fa-bars"></i>Kategoriler
            </a>
            <ul class="category-menu">
                <li class="cat-item has-children">
                    <a href="#">Arts & Photography</a>
                    <ul class="sub-menu">
                        <li><a href="#">Bags & Cases</a></li>
                        <li><a href="#">Binoculars & Scopes</a></li>
                        <li><a href="#">Digital Cameras</a></li>
                        <li><a href="#">Film Photography</a></li>
                        <li><a href="#">Lighting & Studio</a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </nav>
</div>

그리고 그 특정 수업이 여기 있습니다

.category-nav.show .category-menu {
    visibility: visible;
    opacity: 1;
    pointer-events: visible;
}

홈 페이지를 제외하고 수동적 인 'show'클래스가 필요합니다. 어떻게 할 수 있습니까? 내 마스터 레이아웃이 여기 있습니다

<!DOCTYPE html>
<html lang="{{ config('app.locale') }}">

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>@yield('title', config('app.name'))</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Use Minified Plugins Version For Fast Page Load -->
    <link rel="stylesheet" type="text/css" media="screen" href="css/plugins.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="css/main.css" />
    <link rel="shortcut icon" type="image/x-icon" href="image/favicon.ico">
</head>

<body>
<div class="site-wrapper" id="top">

    @include('includes.header')

    @yield('content')

</div>
<!--=================================
    Footer Area
===================================== -->

    @include('includes.footer')

<!-- Use Minified Plugins Version For Fast Page Load -->
<script src="js/plugins.js"></script>
<script src="js/ajax-mail.js"></script>
<script src="js/custom.js"></script>
</body>

</html>

유태인

명명 된 경로의 경우이 답변 에서 제안한대로 다음과 같이 할 수 있습니다 .

<a class="nav-link {{ Route::currentRouteNamed('home') ? 'active' : '' }}" href="#">
    Home
</a>

또는 명명 된 경로를 사용하지 않는 경우 현재 경로 작업을 확인하십시오.

<a class="nav-link {{ Route::currentRouteUses('App\Http\Controdllers\[email protected]') ? 'active' : '' }}" href="#">
    Home
</a>

파일을 전혀 포함 할 수 없습니다.

@if(Route::currentRouteUses('App\Http\Controdllers\[email protected]'))
    @include('includes.header')
@endif

또는

@if(Route::currentRouteNamed('home'))
    @include('includes.header')
@endif

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

여러 클래스에 CSS 적용

분류에서Dev

Reactjs에서 동적 CSS 클래스 이름 사용

분류에서Dev

: host CSS 의사 클래스에 심층 선택 적용

분류에서Dev

Vue.js : 자식 요소에 CSS 클래스 사용

분류에서Dev

@html에서 svelte css 클래스 사용

분류에서Dev

CSS-문장에서 여러 CSS 클래스 사용

분류에서Dev

CSS 클래스의 스타일을 사용하여 서식있는 텍스트를 클립 보드에 복사

분류에서Dev

다른 CSS 파일에서 CSS 클래스 사용

분류에서Dev

웹 사이트에서 CSS 클래스를 사용하여 style.css 찾기

분류에서Dev

CSS / LESS에서 동일한 클래스를 연속으로 여러 번 사용

분류에서Dev

JQuery 자동 완성에서 사용자 정의 CSS 클래스 사용

분류에서Dev

클래스 이름에 공백이있는 CSS를 사용하여 클래스 변경

분류에서Dev

"사이"클래스 인스턴스에 대한 CSS 클래스

분류에서Dev

객체에 CSS 클래스가있는 경우 여러 CSS 클래스 적용

분류에서Dev

Animate.css를 사용하여 Animate 클래스 및 항목에 Animate 클래스 추가 및 제거 문제

분류에서Dev

유사 클래스 첫 번째 자식에 CSS3 적용

분류에서Dev

angular 내부에서 CSS 클래스를 사용하는 방법

분류에서Dev

angular 내부에서 CSS 클래스를 사용하는 방법

분류에서Dev

의사 클래스에서 CSS 무시

분류에서Dev

CSS 클래스 이름에서 태그 사용

분류에서Dev

클래스에서만 CSS 속성을 사용하는 방법

분류에서Dev

CKEditor에서 CSS 클래스를 사용하는 비 독점 스타일 규칙

분류에서Dev

LESS / CSS / Mixins 사용 및 클래스에서 값 전달

분류에서Dev

jQuery를 사용하여 호버에 CSS 클래스 추가

분류에서Dev

laravel Collective 5.2를 사용하여 양식에서 CSS 클래스를 구현하는 방법. *

분류에서Dev

CSS에서 사용하지 않는 클래스 제거

분류에서Dev

일반 CSS에서 Slick.js 사용자 정의 의사 클래스 사용

분류에서Dev

Angular JS에서 ngClass를 사용하여 CSS 클래스 연결 및 제거

분류에서Dev

PHP 스크립트에서 CSS 클래스 사용

Related 관련 기사

  1. 1

    여러 클래스에 CSS 적용

  2. 2

    Reactjs에서 동적 CSS 클래스 이름 사용

  3. 3

    : host CSS 의사 클래스에 심층 선택 적용

  4. 4

    Vue.js : 자식 요소에 CSS 클래스 사용

  5. 5

    @html에서 svelte css 클래스 사용

  6. 6

    CSS-문장에서 여러 CSS 클래스 사용

  7. 7

    CSS 클래스의 스타일을 사용하여 서식있는 텍스트를 클립 보드에 복사

  8. 8

    다른 CSS 파일에서 CSS 클래스 사용

  9. 9

    웹 사이트에서 CSS 클래스를 사용하여 style.css 찾기

  10. 10

    CSS / LESS에서 동일한 클래스를 연속으로 여러 번 사용

  11. 11

    JQuery 자동 완성에서 사용자 정의 CSS 클래스 사용

  12. 12

    클래스 이름에 공백이있는 CSS를 사용하여 클래스 변경

  13. 13

    "사이"클래스 인스턴스에 대한 CSS 클래스

  14. 14

    객체에 CSS 클래스가있는 경우 여러 CSS 클래스 적용

  15. 15

    Animate.css를 사용하여 Animate 클래스 및 항목에 Animate 클래스 추가 및 제거 문제

  16. 16

    유사 클래스 첫 번째 자식에 CSS3 적용

  17. 17

    angular 내부에서 CSS 클래스를 사용하는 방법

  18. 18

    angular 내부에서 CSS 클래스를 사용하는 방법

  19. 19

    의사 클래스에서 CSS 무시

  20. 20

    CSS 클래스 이름에서 태그 사용

  21. 21

    클래스에서만 CSS 속성을 사용하는 방법

  22. 22

    CKEditor에서 CSS 클래스를 사용하는 비 독점 스타일 규칙

  23. 23

    LESS / CSS / Mixins 사용 및 클래스에서 값 전달

  24. 24

    jQuery를 사용하여 호버에 CSS 클래스 추가

  25. 25

    laravel Collective 5.2를 사용하여 양식에서 CSS 클래스를 구현하는 방법. *

  26. 26

    CSS에서 사용하지 않는 클래스 제거

  27. 27

    일반 CSS에서 Slick.js 사용자 정의 의사 클래스 사용

  28. 28

    Angular JS에서 ngClass를 사용하여 CSS 클래스 연결 및 제거

  29. 29

    PHP 스크립트에서 CSS 클래스 사용

뜨겁다태그

보관