세로 이미지를 가로 썸네일로 표현해야 할 때는 이렇게 위아래를 자르면 좋지 않은 경우가 있습니다. 얼굴이 잘리는 경우는 가장 안 좋죠. 그래서 위와 같이 좌우를 블러로 채워 표현하는 게 좋을 때가 있습니다....
CSS
웹으로 말하기 on 22-11-08
반응형 font-* 가 뜨지 않는다 간혹가다 별도의 익스텐션을 설치하다 보면 이미 CSS 자동완성이 적용되어 있음에...
정보공유 vscode 자동완성 CSS
대혼돈의 형준버스 on 22-09-11
- 별도 수정없이 바로 적용되어 html 페이지를 예쁘게 꾸며주는 CSS 라이브러리 * Skeleton
Web CSS
코드루덴스 on 22-07-30
반응형 SASS 기존 웹페이지에 스타일을 적용하기 위해서는 CSS로 하나하나 변경해주어야 하는 번거로움이...
NodeJS CSS sass webpack 웹팩
대혼돈의 형준버스 on 22-07-11
:not(selector) 가상 선택자는 매력적인 놈이지만 아래 한계를 인지하고 사용해야 한다. 중첩시킬 수 없다. :not(:not(...)) 아무 영향을 미치지 않는 놈이 생길 수도 있다. :not(*)...
웹으로 말하기 on 21-04-17
부모 컴퍼넌트에 있는 엘리먼트 뿐만 아니라 자식 컴퍼넌트에도 동일한 클래스명이 있다면 전부 적용 CSS 에서 사용 하는 방법 .parent-class >>> .child-class { /* ... */ } // 1번째 사용 방법 .parent-class[d...
CSS Class Deep scss Selector Style 딮 셀렉터 쉐도우
shaking blog on 19-06-27
IE 에서 flex div 안에 이미지를 넣고 flex 크기에 따라 이미지 크기도 가변되도록 넣어놓았을 시 resizing 이 안되는 버그가 있다. 예를들어 이미지 원본 사이즈가 500px * 500px 인 이미지가 300px * 300px 인...
CSS bug div explorer Flex IE img min-height resizing 이미지
이미지(썸네일)의 크기를 조정하거나 노출하고 싶은 부분만을 잘라내어(Crop) 출력하는 방법들에 대한 이야기입니다. 서버단에서 넘겨받은 이미지를 재가공할때 생각해볼 만한 기법들을 소개합니다. 이미지 크기조정...
크로스브라우징 Crop CSS thumbnail
WEBDIR on 18-12-01
기나긴 삽질 끝에 드디어 웹폰트 무조건 돌아가는 CSS 코드를 발견했다.첨에 font-face로 검색해서 막 삽질하다가 딱히 발견이라기 보다는 구글 얼리 억세스에서 퍼왔다 ㅠㅠ. 일단 IE/FF/Chrome 에서는 정상 동작...
ejnahc's thinkbucket on 16-07-22
흔히 이벤트가 부여된 요소를 숨기면 해당 이벤트가 작동하지 않을꺼라 생각합니다. 대부분 의도한 결과를 반영하지만 숨김처리에 사용한 방법이 opacity 속성을 이용한 경우라면 가시성은 없지만 해당 영역의 이벤...
CSS css3 property
WEBDIR on 16-02-01
대혼돈의 형준버스
코드루덴스
shaking blog
WEBDIR
ejnahc's thinkbucket