로메오의 블로그

SVG 폰트 만들기 위 포스트에서 만든 폰트 아이콘을 before content엔 넣는 방법입니다. .bubble {border-radius: 10px; background: #fff; padding: 10px} .bubble::before {content: '\e909'; font-family: "icomoon"; color: #fff}

가상요소 종류 ::first-line 첫 번째 줄에 스타일 적용 ::first-letter 첫 번째 글자에 스타일 적용 ::before 콘텐츠 시작 부분에 추가 ::after 콘텐츠 마지막 부분에 추가 ::selection 사용자가 마우스 드래그로 선택한 영역에 스타일 적용 ::placeholder input 필드에 힌트 텍스트에 스타일 적용 ::before, ::after content 속성은 필수 한국 미국 중국 일본 한국 | 미국 | 중국 | 일본

한줄 줄이기 .call-summary p { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } 여러줄 줄이기 .call-summary p { white-space: normal; display: -webkit-box; -webkit-line-clamp: 3; /* 3줄 */ -webkit-box-orient: vertical; overflow: hidden; }

.list-group {margin-top: 12px; height: calc(100vh - 190px); overflow-y: scroll;} .list-group::-webkit-scrollbar {width: 10px;} .list-group::-webkit-scrollbar-thumb {background-color: #999; opacity: .5; border-radius: 10px;} .list-group::-webkit-scrollbar-track {opacity: 0 } .list-group {margin-top: 12px; height: calc(100vh - 190px); overflow-y: scroll;} .list-group::-webkit-scrollbar {width: 10p..

VUE.JS 목록 {{message}}. 메세지 1 | 2 | 3 | top | bottom | 추가 | VUE.JS 목록

VUE.JS 목록 vue.config.js module.exports = { transpileDependencies: ['vuetify'], devServer: { proxy: { '/assistant': { target: process.env.VUE_APP_API_PUBLIC_URL, changeOrigin: true } } } } .env.development VUE_APP_DEV=_DEVELOPMENT VUE_APP_API_PUBLIC_URL='http://localhost:8091' VUE_APP_API_PATH='/api/v1/' restApi.ts import axios, { AxiosInstance, AxiosResponse } from 'axios' export enum ServiceUrl..

Figma 목록 SVG를 선택하고 export SVG 합니다. https://icomoon.io/app/#/select 위 사이트에서 import icon을 누릅니다. svg 파일을 모두 선택합니다. Select All을 누릅니다. Generate Font를 누릅니다. 아이콘 이름을 설정하고 Download 합니다. 압축을 풀고 style.css를 열어보면 .icon-contract:before { content: "\e900"; } 위와 같은 형태로 아이콘이 적용되어 있습니다. demo.html 파일을 열어서 코드를 변경해 봅니다. 브라우저에서 열어 확인 해봅니다. size와 color도 변경해 봅니다. Figma 목록

Figma에서 Font Awesome 적용하기 SVG 폰트 만들기 Figma에서 Material Design Icon 사용하기 Figma Layer 아이콘 타입 Figma에서 Autolayout으로 버튼 만들기 [Figma] 색상 스타일 지정, 관리 [Figma] Community 에서 Asset 복제 [Figma] Auto Layout & component