# Tailwind CSS

26개의 포스트
post-thumbnail

CSS 프레임워크

CSS 전처리기는 우리(개발자)에겐 CSS보단 친화적이지만 브라우저가 해석하지 못하는 언어로 작성된 스크립트를 별도 플러그인과 프레임워크를 통해 우리가 아는 CSS로 변환하는데 사용한다. 기존 CSS의 단점인 유지보수의 불편함 등을 보완한다.Sass는 기본적으로 SAS

3일 전
·
0개의 댓글
post-thumbnail

JS Mini projects - AOS Library

tailwind template, AOS Library 사용법

2022년 6월 15일
·
0개의 댓글
post-thumbnail

UI 구현을 쉽고 빠르게! Tailwind CSS

개발자들은 UI를 손쉽게 구현하기 위하여 CSS 프레임워크를 사용합니다. 그 중에 Tailwind CSS에 대해 이야기해보도록 하겠습니다!

2022년 6월 8일
·
0개의 댓글
post-thumbnail

[Tailwind CSS] vscode 플러그인

html 작성 시, 입력한 문자로 시작하는 클래스명들을 보여준다.vscode에서 tailwind 클래스명들을 속성별로 검색 확인할 수 있다.이와 비슷한 플러그인으로는 Tailwind Docs가 있는데, 이는 vscode에서의 바로 확인은 아니고, 검색한 클래스의 설명이

2022년 5월 18일
·
0개의 댓글
post-thumbnail

TailwindCSS

다양한 CSS 명명법이 있다는 것을 알지 못하고 있다 최근에, BEM 명명에 대해 알고 난 뒤 다른 CSS 스타일은 어떤 것들이 있는지 궁금해졌다.HTML, CSS, Vanilla JavaScript를 통해 다양한 시도를 해보던 중, 확실히 명확한 클래스명을 짓는다는

2022년 4월 18일
·
0개의 댓글
post-thumbnail

Tailwind CSS (NextJs환경에서 사용하기)

오늘은 요즘 핫한 CSS 프레임워크인 Tailwind CSS를 Nextjs 환경에서 적용해보며 배워볼 예정이다.Tailwind CSS 는 Utility-First Fundamentals로 이루어진 CSS 프레임워크이다. 아래 예제를 보며 tailwind css를 이

2022년 3월 29일
·
0개의 댓글

⚙️PostCSS 사용하여 Tailwind CSS 개발환경 설정

⚙️PostCSS 사용하여 Tailwind CSS 개발환경 설정 📍Tailwind CSS 설치 📍tailwind.config.js postcss.config.js 추가 📍tailwind.config.js 템플릿 경로 추가 📍tailwind.css css에 tailwind 지시문 추가 tailwind.css 📍package.json scrip...

2022년 3월 16일
·
0개의 댓글
post-thumbnail

3. Tailwind CSS 활용(2)

테두리 두께를 지정할 수 있습니다.태두리의 색상을 지정할 수 있습니다.테두리의 디자인을 선택할 수 있습니다.테두리의 Radus를 설정할 수 있습니다.예시CSS의 display 속성을 자유롭게 설정할 수 있습니다.예시Flex도 자유롭게 사용 가능합니다.예시

2022년 3월 10일
·
0개의 댓글
post-thumbnail

[노마드코더] 캐럿마켓 클론코딩 (1) - Tailwind CSS

Tailwind는 공식 페이지에서 말하길 'utility-first CSS framwork'라고 한다. 이 말인 즉슨 Tailwind가 아주 많은 class를 가지고 있고 우리는 이 여러 class명을 조합하여 가져다 쓸 수 있도록 해준다는 것이다. flex, pt-

2022년 3월 8일
·
0개의 댓글
post-thumbnail

2. Tailwind CSS 활용

손쉽게 배경을 변경할 수 있습니다.예시만약 브라우저에서 1rem === 16px일 경우 size\*4px를 통해 넓이 / 높이를 손쉽게 지정해줍니다.w-32 => 32\*4 = 128px예시패딩과 마진을 클래스 형태로 지정할 수 있습니다.만약 브라우저에서 1rem ==

2022년 3월 7일
·
0개의 댓글
post-thumbnail

1. Tailwind CSS란?

Utility-First를 지향하는 CSS 프레임워크입니다.CSS의 각 속성들을 클래스에 직관적으로 표현함으로써 효율적으로 사용할 수 있게 됩니다.스타일링에 필요한 대부분의 속성들이 클래스 형태로 사전에 정의되어 있고 사용자는 클래스들을 조합해요 사용하면 됩니다.예시

2022년 3월 7일
·
0개의 댓글

tailwind css가 vue component에 적용이 안될 때

를 componenent 파일 어딘가에 넣어봐롸 그럼 된다.

2022년 3월 6일
·
0개의 댓글
post-thumbnail

TVING 클론 코딩 프로젝트 - React-player

ReactPlayer는 React기반의 플레이어 모듈이다

2022년 2월 12일
·
0개의 댓글
post-thumbnail

TVING 클론 코딩 프로젝트 - FramerMotion 으로 슬라이더 구현하기

단순한거였는데 복잡하게 생각해서 해결을 못했던거였다

2022년 2월 9일
·
0개의 댓글
post-thumbnail

TVING 클론 코딩 프로젝트 - Open API

TMDB 사이트 에서 제공하는 Open API를 이용해 영화 TV 목록을 나타내도록 하겠습니다

2022년 2월 8일
·
0개의 댓글

TailWind CSS + Vue

TailWind CSS는 유틸리티 를 우선으로 하는 CSS 프레임워크 마크업에서 직접 모든 디자인을 빌드하도록 구성할 수 있다.

2022년 2월 6일
·
0개의 댓글
post-thumbnail

TVING 클론 코딩 프로젝트 - 시작

🐭 할 얘기가 있다며 시리즈에는 깊은 내용보다는 프로젝트의 흐름과 코드를 어케 구성했는지만 설명할 예정이다

2022년 2월 5일
·
0개의 댓글