본문 바로가기
공부하기

[stencil] 에서 css연결하는 방법

by 날아라못난 2024. 1. 12.
728x90
반응형

pixabay

stencil 에서 css연결하는 방법

 

단일 css가져오기

import { Component } from '@stencil/core';

@Component({
  tag: 'ts-list',
  styleUrl: './ts-list.css',
})
export class TsList {
  // implementation omitted
}

 

여러 css를 가져오기

import { Component } from '@stencil/core';

@Component({
  tag: 'ts-list',
  styleUrls: ['./ts-list-1.css', './ts-list-2.css']
})
export class TsList {
  // implementation omitted
}

 

모드사용

import { Component } from '@stencil/core';

@Component({
  tag: 'ts-list',
  styleUrls: {
     ios: 'ts-list-1.ios.scss',
     md: 'ts-list-2.md.scss',
  }
})
export class TsList {
  // implementation omitted
}

 

직접선언

import { Component } from '@stencil/core';

@Component({
  tag: 'ts-list',
  styles: 'div { background-color: #fff }'
})
export class TsList {
  // implementation omitted
}
728x90
반응형

'공부하기' 카테고리의 다른 글

[stencil+html] <picture>의 사용  (4) 2024.01.17
[stencil]Boolean Props  (2) 2024.01.12
노드 버전 관리를 위해 NVM 사용하기  (1) 2024.01.08
Yarn 설치  (1) 2024.01.08
Node.js 설치하기  (1) 2024.01.08