Speech Bubble1 [CSS] 채팅에 사용할 말풍선 만들기 백개발이 끝나 즐거운 UI시간을 보냈다. 우선 완성본이다. 채팅에는 이 외에도 전송영역, 첨부파일영역 등 다양한 영역이 존재하지만 이번에는 대화영역을 올려서 다음개발 때도 사용하고자 한다. *front는 Vue.js, Quasar 프레임워크를 사용하고 있다. 우선 HTML소스이다. Quasar 프레임워크를 사용하고 있지만 Quasar컴포넌트를 사용하면 css를 고치는데 제약이 좀 있어서 이번에는 Editor만 Quasar컴포넌트를 사용하고 나머지는 div로 만들었다. HTML코드에서 신경써줘야 할 점은 바로 자기자신의 말풍선 class 와 다른사람의 말풍선 class를 구분하는 조건을 적어줘야 한다는 것이다. 나는 Vue.js를 사용하고 있기 때문에 class에 조건을 걸어 바인딩해주었다. 다른 툴을 사.. 2023. 10. 28. 이전 1 다음 728x90
