NewBean의 웹과 콩나무
close
프로필 배경
프로필 로고

NewBean의 웹과 콩나무

  • 분류 전체보기 (499)
    • Programming Language (87)
      • Java (65)
      • C (4)
      • Python (16)
      • R (2)
    • UI & UX (4)
      • Figma (4)
    • Front-End Study (193)
      • HTML+CSS (34)
      • HTML 사전 (6)
      • CSS 사전 (14)
      • Sass (6)
      • 반응형 웹 (8)
      • JavaScript (52)
      • TypeScript (8)
      • React (29)
      • Next.js (9)
      • Angular (1)
      • Vue.js (23)
      • Vite (2)
      • Node.js (1)
    • Back-End Study (101)
      • DBMS (28)
      • Linux (43)
      • Git & GitHub (15)
      • Express (7)
      • Postman (4)
      • REST API (2)
      • PHP (0)
      • Grafana (2)
    • Computer Science (14)
    • 정보처리기사 (76)
      • 1. 요구사항 확인 (1)
      • 2. 화면 설계 (1)
      • 3. 데이터 입출력 구현 (1)
      • 4. 통합 구현 (1)
      • 5. 인터페이스 구현 (1)
      • 6. 프로그래밍 언어 활용 (1)
      • 7. SQL 응용 (1)
      • 8. 서버 프로그램 관리 (1)
      • 9. 소프트웨어 개발 보안 구축 (1)
      • 10. 애플리케이션 테스트 관리 (1)
      • 11. 응용 SW 기초 기술 활용 (1)
      • DB (65)
    • 잡다한 말 (6)
    • 기타 (5)
    • 내가 읽은 책 (5)
    • 없어진 글모음 (7)
  • 홈
  • 방명록
  • 깃허브
  • 포트폴리오
미디어 쿼리

미디어 쿼리

미디어 쿼리 1. 미디어 쿼리 - 화면의 크기나 환경에 따라 웹사이트를 변경하는 기술 2. 기본 문법 - 미디어 쿼리를 작성할 때는 기본적인 순서와 규칙을 따라야 함 → @media [only 또는 not] [미디어 유형] [and 또는 , 콤마] (조건문) {실행문} - @media : 미디어 쿼리 문법의 시작을 알리는 부분 - [only 또는 not] - only 키워드 : 미디어 쿼리를 지원하는 브라우저에서만 미디어 쿼리를 해석하게 해주는 키워드 - not 키워드 : not 다음에 오는 조건을 부정하는 키워드 - 미디어 유형 : 미디어별로 적용할 CSS를 따로 작성함. 미디어 유형은 다음과 같음 기기명 설명 all 모든 장치 print 인쇄 장치 screen 컴퓨터 화면 장치 or 스마트 기기 화면..

  • format_list_bulleted Front-End Study/반응형 웹
  • · 2023. 5. 1.
  • textsms
미디어 쿼리

미디어 쿼리

미디어 쿼리 1. 미디어 쿼리 - 웹 페이지가 표시되는 장치에 반응하도록 하여 반응형 웹을 구현할 수 있는데, 이때 사용하는 것이 미디어 쿼리임 - 미디어 쿼리는 두 가지 방법으로 사용 가능 - @media 규칙 - media 속성 2. @media 규칙을 이용해 미디어 쿼리 사용하기 Lorem ipsum dolor sit amet consectetur adipisicing elit. Lorem ipsum dolor sit amet consectetur adipisicing elit........... - max-width: 800px는 화면 너비가 800이 되기 전까지의 설정 (최대 너비) - min-width: 800px는 화면 너비가 800이 될 때부터의 설정 (최소 너비) 3. media 속성을 ..

  • format_list_bulleted Front-End Study/HTML+CSS
  • · 2022. 11. 2.
  • textsms
  • navigate_before
  • 1
  • navigate_next
공지사항
  • 문의 (juv6262@naver.com)
전체 카테고리
  • 분류 전체보기 (499)
    • Programming Language (87)
      • Java (65)
      • C (4)
      • Python (16)
      • R (2)
    • UI & UX (4)
      • Figma (4)
    • Front-End Study (193)
      • HTML+CSS (34)
      • HTML 사전 (6)
      • CSS 사전 (14)
      • Sass (6)
      • 반응형 웹 (8)
      • JavaScript (52)
      • TypeScript (8)
      • React (29)
      • Next.js (9)
      • Angular (1)
      • Vue.js (23)
      • Vite (2)
      • Node.js (1)
    • Back-End Study (101)
      • DBMS (28)
      • Linux (43)
      • Git & GitHub (15)
      • Express (7)
      • Postman (4)
      • REST API (2)
      • PHP (0)
      • Grafana (2)
    • Computer Science (14)
    • 정보처리기사 (76)
      • 1. 요구사항 확인 (1)
      • 2. 화면 설계 (1)
      • 3. 데이터 입출력 구현 (1)
      • 4. 통합 구현 (1)
      • 5. 인터페이스 구현 (1)
      • 6. 프로그래밍 언어 활용 (1)
      • 7. SQL 응용 (1)
      • 8. 서버 프로그램 관리 (1)
      • 9. 소프트웨어 개발 보안 구축 (1)
      • 10. 애플리케이션 테스트 관리 (1)
      • 11. 응용 SW 기초 기술 활용 (1)
      • DB (65)
    • 잡다한 말 (6)
    • 기타 (5)
    • 내가 읽은 책 (5)
    • 없어진 글모음 (7)
최근 글
인기 글
최근 댓글
태그
  • #react
  • #Git & GitHub
  • #DBMS
  • #Vue.js
  • #리눅스
  • #Python
  • #Java
  • #html+css
  • #정보처리기사
  • #JavaScript
전체 방문자
오늘
어제
전체
Copyright © 쭈미로운 생활 All rights reserved.
Designed by JJuum

티스토리툴바