Notice
Recent Posts
Recent Comments
Tags
- 파일업로드 유효성체크
- asp.net dropdownlist
- asp.net core Select
- javascript 유효성체크
- ViewData
- jquery 바코드
- javascript 바코드스캔
- django 엑셀불러오기
- 바코드 스캔하기
- SSD 복사
- 강제이동
- php 캐쉬제거
- 하드 윈도우 복사
- 타임피커
- javascript 바코드 생성
- XSS방어
- ASP.Net Core 404
- javascript redirection
- XSS PHP
- 맥 오라클설치
- jquery 바코드생성
- 404에러페이지
- 파일업로드 체크
- TempData
- Mac Oracle
- 바코드 생성하기
- 말줄임표시
- 하드 마이그레이션
- asp.net Select
- ViewBag
웹개발자의 기지개
[CSS] 네이버 스마트 에디터 이미지 추가시 반응형 이미지 형태로 수정하기 (max-width 값 먹이기) 본문
웹퍼블리싱/CSS
[CSS] 네이버 스마트 에디터 이미지 추가시 반응형 이미지 형태로 수정하기 (max-width 값 먹이기)
http://portfolio.wonpaper.net 2021. 11. 5. 02:25필자는 에디터로 네이버스마트를 거의 대부분 활용하고 있는데, 반응형 코딩상에서 에디터로 이미지를 추가하면 반응형 형태로 이미지 크기 가변적으로 나오도록 하고 싶었다.
원래 에디터가 이미지를 올리면 자연히 그 이미지 자체의 크기 그대로 화면에 표시되기 때문에, 반응형 코딩상에서는 그 이미지 크기가 그대로 고정되어 버려서 문제가 발생된다.
결국 네이버 에디터로 올린 이미지에도 css 를 먹여서, max-width:100% 코드를 먹이는 게 관건이다.
아래 파일에서 CSS 클래스를 추가해 주도록 하자.
/smarteditor2/css/ko_KR/smart_editor2_in.css
.se2_inputarea img {max-width:100%;}
'웹퍼블리싱 > CSS' 카테고리의 다른 글
[CSS] 말풍선 , 툴팁 기능 구현 ToolTip (0) | 2023.01.21 |
---|---|
[CSS] 긴줄을 말줄임 표시하기 (0) | 2023.01.17 |
[CSS] 유투브를 해당 코드상에서 꽉찬화면으로 보여주기 (반응형) (0) | 2021.09.11 |
[CSS] 자동 말줄임 기능 적용하기 - 문장 말줄임 (0) | 2021.08.25 |
[CSS] 크기가 다양한 썸네일 이미지 만들기 (0) | 2021.06.25 |
Comments