728x90 300x250 SMALL CSS7 flex-basis과 width 차이 flex-basis에 대한 설명은 앞 포스팅을 참고하세요 flex-basis는 기본 크기를 설정하는 것이고 width는 가로 값을 설정하는 속성이라 얼핏 비슷해 보입니다. .item:nth-child(1) { flex-basis: 200px; } .item:nth-child(2) { width: 200px; } 아래와 같이 1번째 item에는 flex-basis를 2번째 item에는 width를 설정하고 결과를 확인해보면 차이가 없기 때문에 그게 그거 아닌가 하는 생각이 들 수 있습니다. 그럼 구지 따로 쓸 필요가 없겠죠? flex-basis과 width 차이점 1. flex-direction 설정값에 따라서 달라진다. 그렇다면 flex-direction을 변경해 주면 어떻게 될까요? .container.. 2021. 11. 9. [css] word-break word-break 줄바꿈 할 때 어떤 기준으로 줄바꿈 할지 정하는 속성 /* 키워드 값 */ word-break: normal; word-break: break-all; word-break: keep-all; word-break: break-word; /* 사용 안함 */ /* 전역 값 */ word-break: inherit; word-break: initial; word-break: unset; normal : CJK(한중일) 문자는 글자 기준, 이외에는기본 줄 바꿈 규칙 사용 break-all : 글자기준으로 줄바꿈 keep-all : CJK(한중일) 문자에서는 단어 기준으로 줄바꿈 그 이외에는 normal과 동일 break-word : overflow-wrap 속성에 상관하지 않고, word-b.. 2021. 8. 12. 코드 예쁘게 자동 정렬하기 (브라켓) : css js등 페이지 보기해서 소스보면 이런식으로 다닥다닥 붙어서 보기 불편한 소스들이 있다.브라켓을 이용하면 이런 붙어 있는 소스들을 간편하게 정리해줄수있다. http://brackets.io/ 브라켓은 위 사이트에서 다운로드 가능하다 브라켓을 열고정렬해주고 싶은 소스를 붙여넣어준다 오른쪽편에 확장기능관리자라는 아이콘을 눌러준다. beautify.io코드를 검색해서 설치해준다. 그럼 오른쪽상단에 마술봉모양의 아이콘이 생긴걸 확인할수 있다. beautify아이콘을 클릭해주면 소스가 보기쉽게 정렬이 된다. 2019. 1. 13. 이전 1 2 다음 728x90 반응형 LIST
