CASSIE'S BLOG

line-height의 값은 다양한 형식을 가질 수 있으며, 일반적으로 다음과 같은 방식으로 사용됩니다: 절대 값: 픽셀(px) 또는 포인트(pt)와 같은 고정된 길이 단위를 사용하여 줄 간격을 지정할 수 있습니다. 예를 들어, line-height: 20px;은 각 줄 간격을 20px로 설정합니다. 상대 값: 1.5와 같이 숫자를 사용하여 줄 간격을 설정할 수 있습니다. 이 경우, 현재 폰트 크기의 1.5배로 줄 간격이 설정됩니다. 즉, 현재 폰트 크기의 150%로 줄 간격이 조정됩니다. line-height: 1.5;는 현재 폰트 크기의 1.5배로 줄 간격을 설정하는 예입니다. 이렇게 설정하면 텍스트가 보다 가독성 있고 텍스트 줄이 서로 겹치지 않도록 보다 자연스러운 간격을 갖게 됩니다. 특히 글꼴 ..

@media는 CSS에서 사용되는 미디어 쿼리(Media Query)의 시작을 나타내는 키워드입니다. 미디어 쿼리는 미디어 타입(예: 화면, 프린터 등) 및 화면 크기, 해상도, 장치 방향 등과 같은 특정 장치 또는 화면 특성에 따라 스타일을 동적으로 적용할 수 있도록 하는 CSS의 기능입니다. @media를 사용하여 다양한 미디어 쿼리를 정의하고, 그에 따라 스타일을 조절할 수 있습니다. 예를 들어, 다음과 같은 코드에서는 화면의 너비가 768px 이하일 때 스타일을 적용합니다. cssCopy code @media (max-width: 768px) { /* 화면 너비가 768px 이하인 경우에 적용될 스타일 */ } 여기서 (max-width: 768px)는 미디어 쿼리의 조건을 나타냅니다. 이 경우,..

const skillData = { skillList: [ { label: "HTML/CSS", detail: ["원하는 UI를 실용적이고, 익숙하게 만들어 낼 수 있습니다.", "빌드시스템(Gulp)과 템플릿 엔진(ejs, jade)의 사용이 가능합니다.", "Css 최신 문법이 숙지되어 있고 Css 프리프로세서 Sass를 사용할 수 있습니다."], icon: "fab fa-html5", }, { label: "jQuery", detail: ["다양한 속성과 메소드를 능숙하게 사용이 가능합니다.", "Ajax을 활용하여 비동기 통신으로 데이터 요청을 할 수 있습니다.", "jQuery UI 라이브러리를 활용할 수 있습니다."], icon: "fab fa-node-js", }, { label: "Java..

React 컴포넌트에 CSS를 넣는 방법은 다양합니다. 스타일드 컴포넌트(Styled Components)는 백틱을 사용하여 CSS를 정의하고 컴포넌트에 적용하는 방법 중 하나입니다. import React, { useState, useEffect } from "react"; import styled from "styled-components"; import Heading from "../atoms/Heading"; function PageHeader(props) { const { children } = props; const [Load, setLoad] = useState(false); useEffect(() => { setTimeout(() => { setLoad(true); }, 450); retu..

함수선언식은 호이스팅이되기때문에 함수를 선언하기 전에 호출을 해줘도 호출이 잘 되는 것을 알 수 있단다.

9강 배열은 인덱스 기반의 자료구조이고, 순서를 고려한다. 오브젝트는 키 기반의 자료구조이고, 순서를 고려하지않는다.