国产 无码 综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

element-plus走馬燈不顯示

這篇具有很好參考價(jià)值的文章主要介紹了element-plus走馬燈不顯示。希望對(duì)大家有所幫助。如果存在錯(cuò)誤或未考慮完全的地方,請(qǐng)大家不吝賜教,您也可以點(diǎn)擊"舉報(bào)違法"按鈕提交疑問。

問題描述

依賴正確,代碼用法正確,但是element-plu走馬燈就是不顯示??!

 <div class="content">
      <el-carousel height="150px" width="200px">
        <el-carousel-item v-for="item in 4" :key="item">
          <div class="h-100px w-100px">{{ item }}</div>
        </el-carousel-item>
      </el-carousel>
     
    </div>
  </div>



.content {
      display: flex;
      width: 750px;
      height: 256px;
      margin-top: 24px;
      margin-left: 16px;
      overflow: hidden;

      //   div {
      //     margin-left: 20px;
      //     &:first-child {
      //       margin-left: 0;
      //     }
      //   }
    }

并且盒子的寬度總是0
element-plus走馬燈不顯示,css,css3,javascript


錯(cuò)誤排查:

在現(xiàn)有的布局中插入官方的案例,也不能顯示
但是把整個(gè)頁面都使用官方案例就可以正常顯示
所以,懷疑時(shí)自己的樣式?jīng)_突了


解決方案:

就content一個(gè)盒子,看到 display: flex;就知道不對(duì)勁,去掉flex布局就正常了

element-plus走馬燈不顯示,css,css3,javascript文章來源地址http://www.zghlxwxcb.cn/news/detail-734004.html

到了這里,關(guān)于element-plus走馬燈不顯示的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!

本文來自互聯(lián)網(wǎng)用戶投稿,該文觀點(diǎn)僅代表作者本人,不代表本站立場(chǎng)。本站僅提供信息存儲(chǔ)空間服務(wù),不擁有所有權(quán),不承擔(dān)相關(guān)法律責(zé)任。如若轉(zhuǎn)載,請(qǐng)注明出處: 如若內(nèi)容造成侵權(quán)/違法違規(guī)/事實(shí)不符,請(qǐng)點(diǎn)擊違法舉報(bào)進(jìn)行投訴反饋,一經(jīng)查實(shí),立即刪除!

領(lǐng)支付寶紅包贊助服務(wù)器費(fèi)用

相關(guān)文章

  • Element-ui的Carousel走馬燈組件動(dòng)態(tài)渲染高度

    在前端 vue 項(xiàng)目開發(fā)中經(jīng)常會(huì)用到走馬燈的場(chǎng)景,然而在采用Element-ui的情況下, el-carousel 走馬燈組件有一個(gè)默認(rèn)的固定高度 300px 。如下所示: 這樣會(huì)導(dǎo)致網(wǎng)頁的全屏的 banner 被壓縮或拉伸,變形十分難看,在一個(gè)認(rèn)真的切圖仔眼里是無法容忍的。然而業(yè)務(wù)方在使用的時(shí)候沒

    2024年02月03日
    瀏覽(32)
  • Element Ui的走馬燈Carousel時(shí),當(dāng)內(nèi)容長(zhǎng)度為2時(shí)循環(huán)方向異常

    當(dāng)走馬燈只有兩項(xiàng)時(shí) ,第一次切換時(shí)動(dòng)畫效果是右滑,第二次切換時(shí)變成了左滑 就變成了左右左右來回切換而不是一個(gè)方向無限循環(huán) 解決辦法 當(dāng)數(shù)據(jù)只有兩項(xiàng)時(shí) 復(fù)制一遍數(shù)據(jù) ,比如1,2 ==1,2,1,2 自定義指示器,在只有兩項(xiàng)時(shí)顯示自定義的指示器,同時(shí),監(jiān)聽自定義指示

    2024年02月15日
    瀏覽(57)
  • (Carousel)解決:Element-ui 中 Carousel 走馬燈的樣式的修改問題

    (Carousel)解決:Element-ui 中 Carousel 走馬燈的樣式的修改問題

    1、 Element-ui 提供組件情況: 其一、 Element-ui 自提供的代碼情況為(示例的代碼,例子如下): 代碼地址: https://element.eleme.cn/#/zh-CN/component/carousel 其二、頁面的顯示情況為: 1、 Carousel 自提供的代碼的實(shí)踐: 其一、代碼為: 其二、頁面展示為: 2、 Carousel 代碼相關(guān)屬性的使用

    2024年01月25日
    瀏覽(37)
  • 制作輪播圖經(jīng)驗(yàn)分享——element ui走馬燈的使用(附源碼,效果截圖)

    制作輪播圖經(jīng)驗(yàn)分享——element ui走馬燈的使用(附源碼,效果截圖)

    先附上效果圖: ??element ui鏈接地址:Carousel 走馬燈 | Element Plus (gitee.io) 源碼: 這里我使用的是靜態(tài)圖片(本地) 經(jīng)驗(yàn)分享: 在制作輪播圖的時(shí)候經(jīng)常會(huì)發(fā)現(xiàn)圖片大小不一,這時(shí)候可以在img標(biāo)簽里加上width:100%;height:100%即可實(shí)現(xiàn)圖片鋪滿。 當(dāng)然,這只是輪播圖的一種,還

    2024年02月11日
    瀏覽(25)
  • css空間轉(zhuǎn)換/視距/空間旋轉(zhuǎn)/立體呈現(xiàn)/3d導(dǎo)航案例/空間縮放/animation動(dòng)畫/走馬燈案例/精靈動(dòng)畫/多組動(dòng)畫/全民出游案例

    css空間轉(zhuǎn)換/視距/空間旋轉(zhuǎn)/立體呈現(xiàn)/3d導(dǎo)航案例/空間縮放/animation動(dòng)畫/走馬燈案例/精靈動(dòng)畫/多組動(dòng)畫/全民出游案例

    空間:是從坐標(biāo)軸角度定義xyz三條坐標(biāo)軸構(gòu)成了一個(gè)立體空間按,z軸位置與視線方向相同。 屬性:transform ? ? ? ? transform:translate3d(x,y,z); ????????transform:translatex(); ????????transform:translatey(); ????????transform:translatez(); 取值(正負(fù)均可) ? ? ? ? 像素

    2024年04月22日
    瀏覽(29)
  • ElementUI淺嘗輒止14:Carousel 走馬燈

    在有限空間內(nèi),循環(huán)播放同一類型的圖片、文字等內(nèi)容 結(jié)合使用 el-carousel 和 el-carousel-item 標(biāo)簽就得到了一個(gè)走馬燈。幻燈片的內(nèi)容是任意的,需要放在 el-carousel-item 標(biāo)簽中。默認(rèn)情況下,在鼠標(biāo) hover 時(shí)底部的指示器時(shí)就會(huì)觸發(fā)切換。通過設(shè)置 trigger 屬性為 click ,可以達(dá)到點(diǎn)

    2024年02月10日
    瀏覽(28)
  • 實(shí)現(xiàn)NoticeBar 通知欄。走馬燈公告欄

    微信小程序封裝公共組件——實(shí)現(xiàn)NoticeBar 通知欄。走馬燈公告欄 代碼如下(示例): index.wxml代碼如下(示例): index.ts 公告通知欄父組件傳notice數(shù)組,組件設(shè)置了timer可以多條進(jìn)行輪播

    2024年02月10日
    瀏覽(60)
  • 用 React+ts 實(shí)現(xiàn)無縫滾動(dòng)的走馬燈

    用 React+ts 實(shí)現(xiàn)無縫滾動(dòng)的走馬燈

    走馬燈是一種常見的網(wǎng)頁交互組件,可以展示多張圖片或者內(nèi)容,通過自動(dòng)播放或者手動(dòng)切換的方式,讓用戶能夠方便地瀏覽多張圖片或者內(nèi)容。 本次實(shí)現(xiàn)的不是輪播圖而是像傳送帶一樣的無限滾動(dòng)的形式。 走馬燈可設(shè)置一下屬性: 滾動(dòng)速度 滾動(dòng)方向 一屏要顯示項(xiàng)的個(gè)數(shù)

    2024年02月13日
    瀏覽(24)
  • Proteus仿真--基于51單片機(jī)的走馬燈實(shí)現(xiàn)(仿真文件+程序)

    Proteus仿真--基于51單片機(jī)的走馬燈實(shí)現(xiàn)(仿真文件+程序)

    本文主要介紹基于51單片機(jī)的走馬燈仿真(完整仿真源文件及代碼見文末鏈接) 本設(shè)計(jì)中有16個(gè)LED燈用于流水走馬演示,一位數(shù)碼管用于顯示當(dāng)前模式狀態(tài),3個(gè)按鍵分別用于選擇模式及加減速度控制 仿真圖如下 其中 K1:用于模式切換選擇,有多種模式可切換 K2:加速流水/走

    2024年02月06日
    瀏覽(69)

覺得文章有用就打賞一下文章作者

支付寶掃一掃打賞

博客贊助

微信掃一掃打賞

請(qǐng)作者喝杯咖啡吧~博客贊助

支付寶掃一掃領(lǐng)取紅包,優(yōu)惠每天領(lǐng)

二維碼1

領(lǐng)取紅包

二維碼2

領(lǐng)紅包