Html 身高：100%；不'；我没有出现

这个问题看起来很简单，但如果我在css中插入

height:100%

，则不可能将

.l-main

显示为

height:100%

。太大了。除非它太小了。我已经尝试插入

html，body{margin:0；padding:0；height:100%；}

事实上，我使用引导和角度

index.ejs

<div class="l-cotents">
    <div class="l-main">
        <nav class="l-side child">
            <bl-side ng-reflect-title="設定" ng-reflect-items="[object Object],[object Object">
            <nav class="l-side bl-side">
                <ul class="c-nav">
                    <li class="c-nav__list">
                        <span class="c-nav__mejorItem">ワンオフ</span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/custvcle-title" href="./mastar_m/mastar_m.ejs">マスメン</a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/employee" href="/maintenance/employee">ガイド</a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/label" href="/maintenance/label"></a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/companymgt" href="/maintenance/companymgt"></a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/organization" href="/maintenance/organization"></a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/vcleregoffice" href="/maintenance/vcleregoffice"></a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/listitem" href="/maintenance/listitem"></a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/numbering" href="/maintenance/numbering"></a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/general-initial" href="/maintenance/general-initial"></a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/vehicle-makername" href="/maintenance/vehicle-makername"></a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/carinsurance" href="/maintenance/carinsurance"></a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/vehicle-modelname" href="/maintenance/vehicle-modelname"></a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/custvcle-remarks" href="/maintenance/custvcle-remarks"></a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="" href="/maintenance/"></a></span>
                    </li>
                    <li class="c-nav__list">
                        <span><a class="c-nav__link c-nav__link--side" ng-reflect-router-link="/carowner" href="/maintenance/carowner"></a></span>
                    </li>
                </ul>
            </nav>
            </bl-side>
        </nav>
        <section class="l-common content">
            <div class="l-common__inner">
                <div class="l-common__inner__cell l-common__inner__cell--contents main-content">
                    <router-outlet></router-outlet>
                    <ng-component ng-version="4.0.1">
                    <bl-title _nghost-c8="" ng-reflect-title="TOP" ng-reflect-is-complete-button-group-view="false" ng-reflect-is-trash-mode-button-view="true">
                    <h1 class="c-headding u-shadow--headding bl-title">
                       <div><span class="bl-title-title">ワンオフ</span></div>
                        <div class="btn-group btn-toggle pull-right">
                            <button class="btn-group btn-toggle bl-title-heading-button" ng-reflect-klass="btn-group btn-toggle bl-title-" ng-reflect-ng-class="[object Object]">
                              <span class="btn c-btn--blue"><span>編集</span></span>
                              <span class="btn c-btn--gray"><span>ゴミ箱</span></span>
                            </button>
                        </div>
                    </h1>
                    </bl-title>
                    <div class="maintenance-body col-lg-11 col-md-11 col-sm-11 col-xs-11"></div>
                    <span></span>
                    </ng-component>
                </div>
            </div>
            <div class="u-margin20">
                <p class="u-mg15"><a href="#">002_業務メニュー</a></p>
                <p class="u-mg15"><a href="#">003_整備メニュー</a></p>
                <p class="u-mg15"><a href="#">004_日次メニュー</a></p>
                <p class="u-mg15"><a href="#">005_マスタメンテメニュー</a></p>
                <p class="u-mg15"><a href="#">013_ヘルプ</a></p>
                <p class="u-mg15"><a href="#">014_大分類操作ナビゲーション</a></p>
                <p class="u-mg15"><a href="#">015_中分類操作ナビゲーション</a></p>
                <p class="u-mg15"><a href="#">016_ナビゲーションリスト</a></p>
                <p class="u-mg15"><a href="#">021_顧客車両整備履歴照会</a></p>
            </div>
        </section>
    </div>
</div>

在您的代码中，

是父项，您已将高度设置为

高度：100%！重要的将此高度定义为固定高度，如
高度：200px！重要的因此您可以添加子类
高度：100%！重要的

给html元素100%的高度，给body元素100%的高度

html, body {
      width: 100%;
      height: 100%;
      background: white;
      margin:0;
      padding:0;
    }

我不太清楚你在问什么，但你试过用100vh替换100%吗？是的，这正是我所期望的。非常感谢！！！！这是我修改过的html代码，正文{margin:0；padding:0；height:100vh；}.l-coents{height:100vh；}.l-side a，.l-side sub a{color:#fff；text decoration:none；}.l-side{display:inline block；width:26.5rem；height:100vh；}看到了吗？除非定义了父对象或对象本身，否则不能使高度达到100%。
html, body {
      width: 100%;
      height: 100%;
      background: white;
      margin:0;
      padding:0;
    }