목록CSS (22)
프론트엔드 정복하기
testsetestsetse testsetestsetse 위처럼 flex container 내에 텍스트 요소 있다고 할 때, 텍스트가 container 너비를 흘러넘치면, 앞쪽 텍스트 박스가 줄바꿈이 되는 현상이 있다. 이때 앞이 아닌 뒤의 컨텐츠에 'flex:1;' 을 적용하면 앞의 텍스트가 줄바꿈 되지 않는다.
flex -> flex-grow flew-shrink flex-basis 를 나타낸다. 어떤 박스 2개를 2대 1의 비율로 배치하고 싶었다. 그래서 flex:2; flex:1; 을 적용하니 성공하였음. 그런데 flex 의 3가지 속성을 모두 넣고 싶었을 때 어떻게 해야할지 모르겠다!! 여기서 중요한 것은 flex-basis 였음. flex-basis 속성으로 자주 사용하는 것은 auto 또는 0이다. 이때 0은 px 이나 % 처럼 단위를 함께 써줘야 한다. auto 로 설정하면 콘텐츠의 크기를 기준으로 크기가 설정되고, 0 으로 설정하면 그것을 감싸는 container 기준으로 컨텐츠의 크기가 결정된다. 컨테이너 안에 원하는 비율대로 맞춰 넣고 싶다면 0(%) 로 지정해줘야 한다! 참고 사이트 https..
1. clsx 활용 2. 템플릿문자열 활용 www.python2.net/questions-191191.htm javascript - reactjs 질문 - 삼항 연산자를 사용하여 구성 요소에 여러 클래스를 어떻게 적용합니까? 삼항 연산자를 사용하여 구성 요소에 여러 클래스를 적용하고 싶습니다. 일반 버튼 스타일을 포함하는 공유 ts 테마 파일이 있지만 화면 너비에 따라이 특정 구성 요소에 크기를 다르게 표시하 www.python2.net
보호되어 있는 글입니다.
CSS 의 resize 속성은 - 요소의 size가 조정 가능한지의 여부 - 를 결정한다. IE는 지원하지 않는다! div{ resize:none | horizontal | vertical | both | initial | inherit ; } ** resize 속성이 적용되지 않는 요소 ======>>>> inline요소 or overflow:visible인 block요소
medium.com/@thexap/how-to-setup-bulma-css-framework-with-react-under-5-minutes-a3d8c2c33a87 How To Setup Bulma CSS Framework With React Under 5 Minutes For my next React project I decided to use a CSS framework. Before that I was using Styled-components to style my components. medium.com ** app.scss 파일에서 각각의 sass 파일을 불러오기 전에 @import '~bulma/sass/utilities/_all.sass'; 위를 먼저 불러와줘야, 각 sass 파일의 변수들을..