CSS

[CSS] -prefix-free 사용하기

- Vendor Prefix 알아보기 - [CSS] Vendor Prefix란? vendor prefix가 무엇일까요? 우선, prefix에 대해 알아보겠습니다 :) Prefix의 뜻 알아보기 우선 prefix를 네이버 사전에서 찾아보면 위와 같이 "접두사"라는 뜻이 나옵니다. 자, 그럼 CSS에서 vendor prefix는. codingdiary26.tistory.com Vendor Prefix를 사용할 때, 일일이 CSS 속성에 각 브라우저의 Vendor Prefix를 입력하는 것은 매우 귀찮은 일입니다. 그런데, 마침 이 Vendor Prefix를 작성하지 않아도 알아서 자동으로 Vendor Prefix를 넣어주는 방법이 있습니다 :D Prefix free: Break free from CSS ve..

[CSS] Vendor Prefix란?

vendor prefix가 무엇일까요? 우선, prefix에 대해 알아보겠습니다 :) Prefix의 뜻 알아보기 우선 prefix를 네이버 사전에서 찾아보면 위와 같이 "접두사"라는 뜻이 나옵니다. 자, 그럼 CSS에서 vendor prefix는 영어의 un-, pre-처럼 앞에 붙여 쓸 수 있을 것 같다는 생각이 드실겁니다! 그럼 이제 한번 vendor prefix가 뭔지 알아봅시다! Vendor Prefix 알아보기 더보기 Vendor Prefix Vendor(판매 회사, 즉 브라우저 공급업체) Prefix(접두사) CSS에서 vendor prefix는 -moz-, -webkit-과 같이 쓸 수 있습니다. 그런데, 이게 무슨 역할을 하는 걸까요? Vendor Prefix는 실험적인 CSS 기능을 사용..

font-family란?

자, 코딩하시는 분들이 아마 한 번쯤은 들어보셨을 font-family는 무엇일까요? (못 들어보셨어도 괜찮습니다 :) font-family란 무슨 폰트로 지정해줄지 정해주는 코드입니다!! 자, 그럼 font-family는 어떤 형식으로 쓸까요? font-family: 'Noto Sans', sans-serif; 각 언어마다(css, React Native....) font-family가 조금씩 다르겠지만, 아마 위와 비슷할 겁니다. 우선 이 코드는 'Noto Sans'라는 폰트와 산세리프라는 폰트를 쓴다는 의미입니다. (물론 'Noto Sans'는 따로 먼저 나 @import로 불러와주어야 합니다.) span { font-family: 'Noto Sans', san-serif; } 이렇게 해주면, sp..

티스토리(Tistory) 블로그에서 폰트 적용하기!!

안녕하세요!! 오늘은 티스토리에서 폰트를 적용하는 방법에 대해 알려드리려고 합니다!! 우선, 티스토리는 자유롭게 블로그를 꾸밀 수 있다는 장점이 있어요! 그래서!! 폰트도 내가 원하는 폰트를 짜잔!! 하고 바꿀 수 있어요! 자!! 그럼!! 이 𝑻𝒊𝒔𝒕𝒐𝒓𝒚에서 폰트를 어떻게 바꾸냐! 하시는 분들이 많으실 거라 생각해요ㅎㅎ 우선, Google Fonts에 들어가줍니다. (폰트를 따로 다운받거나, 다른 사이트에서 해도 됩니다!!) 들어가주시고, 자신이 원하는 폰트를 선택합니다. 저는 깔끔한 Noto Sans KR로 했어요!! 그러면, 이렇게 폰트에 대해 나옵니다. 여기서!! 원하시는 폰트 스타일(굵기)을 골라줍니다. (+ Select this style 버튼) 추가해주시면, 이렇게 오른쪽에 창이 뜹니다. 여..