FrontEnd/CSS 관련자료13 코드스피츠 76 - 1 (Graphic system) 강의 정리 보호되어 있는 글 입니다. 2019. 9. 30. word-break에 대한 개념 정리 word-break에 대한 개념 정리 word-break는 업무상에서 글자를 적정한 위치에서 줄 바꿈해줄 때 사용한다.정확히는 word-wrap 또한 같이 사용되고 이러한 값들이 CJK(Chinese, Japanese, Korean) 및 non-CJK 에 따라 구분되어 적용이 된다. (참고)* CJK(Chinese, Japanese, Korean)* non-CJK (그 외 언어 : 영어, 숫자, 베트남어 등) word-break 개념단어의 분리를 어떻게 할 것인지 결정한다. 예) (공백/띄어쓰기) 날씨가`좋아요예) (음절) 날`씨`가`좋`아`요` work-break 속성 (DOC에 설명된 개념을 적기엔 이해하기 모호한 부분이 있어서 각 속성별로 정리한 표를 첨부함) /* Keyword values */w.. 2019. 3. 22. 게시판 화면 구성하면서 사용한 자료 정리 select 태그 내에 option 태그에선 클릭이벤트가 발생하지 않는다, 대신 change 이벤트를 사용해서 각 옵션을 클릭할 시 효과가 나타나게 해야함https://stackoverflow.com/questions/46260052/using-click-in-select-options-vue-js-2 input 태그에서 돋보기 아이콘을 넣고 싶다면? FontAwesome 에서 제공하는 css 파일을 넣고 해당하는 옵션들을 태그에 사용하면 됨https://teamtreehouse.com/community/how-do-i-put-icons-inside-of-input-fields 2018. 11. 12. css center-align 및 box-sizing 및 box-shadow 관련 자료 1, 100, 1000 이렇게 숫자들이 li 형태로 배치가 될 때 1 10100 이런 식으로 정렬되게 하고 싶었다. 방법이 없나 좌절할 때 쯤 https://webdesign.tutsplus.com/ko/tutorials/the-holy-grail-of-css-centering--cms-22114 에서 부모 element의 display를 table로 주고 자식을 table-cell 로 주어 숫자들이 중앙정렬 되게 해주는 방법을 알려주어 정렬할 수 있었다. box-sizing 개념 * content-box* border-box 두 가지가 있고 width:100px height:100px 일 때 border-box는 padding과 border을 포함해서 총 크기가 100*100 이 되게 한다.하지만 co.. 2018. 10. 18. 이전 1 2 다음