Ionic 如何自定义特定离子组件的样式

qnakjoqk 于 2022-12-09 发布在 Ionic

关注(0)|答案(1)|浏览(147)

我是 Ionic 新手，我

have this lines of code : 

  <ion-buttons slot="start">
          <ion-back-button :default-href="pageDefaultBackLink"></ion-back-button>
          <ion-button router-link="/memories/add" color="light">---1---</ion-button>
          <ion-button router-link="/memories/add" color="light">---2---</ion-button>
          <ion-button router-link="/memories/add" color="light">---3---</ion-button>
          <ion-button router-link="/memories/add" color="light">---4---</ion-button>
   </ion-buttons>

我尝试做的是将一些自定义样式添加到最后一个ion-button组件，但我不知道如何才能做到这一点，Nb：我使用的是vue 3和ionic 6

ionic-framework

来源：https://stackoverflow.com/questions/72792023/how-to-custom-style-a-specific-ionic-component

1条答案

按热度按时间

ezykj2lf1#

您需要全局使用CSS，或者在相应的Sass文件（.scss）上使用CSS，并将其添加到类或ID中，然后在CSS文件中将其作为目标。
有些样式可以直接使用原始CSS更改，有些则必须访问Shadow DOM。
例如，您的ion-button和CSS可能如下所示：

<ion-button class="myButton">Hello World, Take Me Somewhere</ion-button>

CSS：

.myButton {
    font-size: 30px
}

这将为使用myButton类的所有地方分配30px的字体大小。
看一看离子按钮CSS自定义属性，以便在正确的方向上推动。
您还可以从阅读CSS中受益，w3schools是一个很好的起点。

赞(0）回复(0）举报 2022-12-09

我来回答

Ionic 如何自定义特定离子组件的样式

1条答案

相关问题

热门标签

最新问答