Texonom
Texonom
/
Engineering
Engineering
/Software Engineering/Programming/Programming Language/Programming Languages/Style Programming Language/CSS/CSS Framework/CSS Pre Processor/SCSS/
SCSS Media Query
Search

SCSS Media Query

Creator
Creator
Seonglae Cho
Created
Created
2021 Apr 21 5:2
Editor
Editor
Seonglae Cho
Edited
Edited
2023 Jun 7 13:2
Refs
Refs
분기점은 변수로 만들고, @content로 내용이 비워져있는 믹스인을 작성
// Break Point $tablet: 768px; $laptop: 1020px; $desktop: 1400px; // Mixins @mixin tablet { @media (min-width: #{$tablet}) { @content; } } @mixin laptop { @media (min-width: #{$laptop}) { @content; } } @mixin desktop { @media (min-width: #{$desktop}) { @content; } }
 
 
.logo { width: 20px; @include desktop { width: 40px; } }
 
 
 
 
 
반응형 웹 뚝딱 만들기 (1) - 뷰포트 메타태그와 미디어 쿼리
이 글은 공동 기술 블로그(tech.yeon.me)에도 올린 글입니다. (여기에서도 숨겨진 좋은 글을 발견할지도 몰라요!) 모바일 사용자가 점점 늘어나는 요즘 반응형으로 만든 웹 사이트를 쉽게 찾아볼 수 있습니다. 빠트릴 수 없는 기술이 된 만큼, 오늘은 반응형을 만들기 위한 몇 가지 방법들을 정리해봤습니다 🤘 이 글에서는 반응형을 위한 기본인 뷰포트와 미디어 쿼리를 다루며, 다음 글에서는 CSS 속성을 활용해 빠르게 반응형을 만드는 법을 다룰 생각입니다.
반응형 웹 뚝딱 만들기 (1) - 뷰포트 메타태그와 미디어 쿼리
https://nykim.work/84
반응형 웹 뚝딱 만들기 (1) - 뷰포트 메타태그와 미디어 쿼리
 
 

Recommendations

Texonom
Texonom
/
Engineering
Engineering
/Software Engineering/Programming/Programming Language/Programming Languages/Style Programming Language/CSS/CSS Framework/CSS Pre Processor/SCSS/
SCSS Media Query
Copyright Seonglae Cho