# opacity

CSS 속성 (2)
1\. overflow요소의 크기 이상으로 내용이 넘쳤을 때, 보여짐을 제어하는 단축 속성기본: visible - 넘친 내용을 그대로 보여줌hidden - 넘친 내용을 잘라냄auto - 넘친 내용이 있는 경우에만 잘라내고 스크롤바 생성overflow는 overflow-

이미지 조작하기
\-blur(px) : 흐림효과 10px만 둬도 엄청 흐려진다.\-brightness(%): 밝기 조정 100이 기본값이라고 생각하면 된다. 0은 완전 어두워진다.\-contrast(%):고대비:\-drop-shadow(가로그림자px 세로그림자px 흐림px 색깔):그림
TIL - declarations
📌 단위 (units) 절대 길이 단위 : cm, mm, px등 상대 길이 단위 : em, rem, vw, vh 등 백분률 : % 1. 절대 길이 단위 px 디바이스 화면에서 이미지를 표현하는 가장 작은 단위 요소의 넓이, 높이, 패딩, 마진, 보더 값, 폰트 사이즈

⭐️ Flex & Opacity
Project를 하다가 자세히 알아보고 싶은 속성이 생겨 기록해두려 한다.flex와 opactity이라는 프로퍼티를 알아보도록 하자.The flex CSS shorthand property sets how a flex item will grow or shrink to

[CSS][Layout][Hidden Content]
grid, flex, block, inline 외에 해당 속성은 화면에서 보이는 것을 숨길 수도 있다.해당 요소는 공간을 차지하지 않는다.주로 미디어쿼리에서, 디바이스마다 보이는 것을 바꾸고 싶을 때 사용한다.미디어 쿼리나 display:block없이 리액트에서 제어할

display
display display 속성은 레이아웃에서 자주 쓰이고 중요한 속성 중 하나입니다 display가 가지는 속성값은 다음과 같습니다 요소가 어떻게 배치될 지 설정하는 속성으로 값에 따라 요소의 배치가 달라집니다 display는 요소가 기본적으로 가지는 값과
[CSS] 태그를 숨기거나 보이게 하는 3가지 방법
태그가 나타나고 감춰짐에 따라 transition을 적용하고 싶다면 이 속성을 추천태그가 숨겨지면 클릭 이벤트도 적용되지 않는다.태그의 투명도를 조절하는 방법태그가 눈에 보이지 않을 뿐 클릭 이벤트는 적용 됨.. 태그를 화면에서 완전히 감추거나 나타나게 한다.trans
[TIL] 2021/11/12
용도: modal에서 부모의 backdrop주의: 부모에서 적용하려는 opacity가 배경인 경우만 가능사용법 in CSSopacity: Xrgba: 0부모에서 css 예시용도: modal에서 부모의 backdrop을 클릭했을 때만 이벤트 발생하도록(onClick)사용

display, visibility, opacity 프로퍼티
1. display display 프로퍼티는 layout 정의에 자주 사용되는 중요한 프로퍼티이다. 1.1 block 항상 새로운 라인에서 시작한다. 화면 크기 전체의 가로폭을 차지한다. (width: 100%) width, height, margin, padding

[CSS] Color & Background 요소
Color와, background-position, background-repeat같은 Background 요소들에 대해 다룬다.

RGB Opacity
RGB를 이용해서 색을 지정할 때 opacity 값을 주고 싶을 때가 있다.예를 들면, \`물론 16진수를 계산해서 넣으면 된다!이번 포스트에서는 주로 사용하게 되는 opacity 값을 미리 써놓으려고 한다.이상 끝!
앞 뒤에 가상 요소
가상 요소(Pseudo-Element)란?– 가상클래스(Pseudo-Class)는,별도의 class를 지정하지 않아도 지정한 것 처럼요소를 선택할 수 있습니다.– 가상요소(Pseudo-Element)는, 가상클래스처럼 선택자(selector)에 추가되며,존재하지 않는

Display, Visibility, Opacity 프로퍼티
: layout 정의에 자주 사용되는 프로퍼티block: block 특성을 가지는 요소(block 레벨 요소)로 지정inline: inline 특성을 가지는 요소(inline 레벨 요소)로 지정inline block: inline-block 특성을 가지는 요소(inln

scroll 값으로 opacity 값 비율구하기
대표적으로 애플사이트에서 scroll값을 이용해 다양한 효과를 연출하는 것을 볼 수 있다. ( 멋지다, 이쁘다..) scroll값으로 opacity 값 비율 0~1 까지의 범위를 구하는 법을 알아보도록 하겠습니다.만약 위와 같이 4개의 섹션이 존재하고, section

CSS 2.박스 모델
박스의 크기 박스 너비 = 내용물(content)너비+왼쪽 패딩+오른쪽 패딩+왼쪽 CSS테두리 테두리 스타일(모양), 색상,두께,둥근 테두리 지정 가능 => 모서리별 다른 스타일,두께 가능 border스타일 지정해야 다른 속성 사용 가능 각 변 별로

CSS 기초 - 3 (position, opacity, z-index, overflow...)
요소의 투명도를 조절하는 스타일 속성이며, 0.0부터 1.0 사이의 값으로 설정할 수 있다.요소의 위치를 설정할 수 있다.static : 기본 값이며, 마크업 순서대로 배치된다. top, left, right, bottom, z-index 값에 반응하지 않는다. rel

element 숨기는 5가지 방법
Opacity이 속성은 요소의 투명성을 설정하기 위한 것이다. 불투명도를 0으로 설정하면 요소가 시각적으로 숨겨진다. 요소는 여전히 해당 위치를 차지하며 웹 페이지의 레이아웃에 영향을 준다. 사용자 상호 작용에도 응답한다.불투명 할 때와 투명할 때 똑같이 동작한다.이