테스트 사이트 - 개발 중인 베타 버전입니다

에디터로 글씨를 키운 경우, line-height를 자동으로 해당 글씨 크기보다 크게 .... 채택완료

sinbi 8년 전 조회 3,447

설정하는 방법 있을까요?

예를 들어,

체에디터5로 드래그해서 글씨를 키운 경우, 아래처럼 폰크 크기만 들어갑니다.

font-size:36px;;">그누보드

그러다보니, 모바일 버전에서 글씨 겹침 현상이 발생하네요.

만약, 저렇게 글씨 크기가 36px일 경우 

자동으로 상하 2px 정도 늘린 40px 정도로 스타일 들어가게 하려면 어떻게 해줘야 하는지?

본문에 작성글의 모든 요소 (p , span, font 등 요소) 등에 일괄적으로 증가시키면 될 것 같은데,,

혹시, 참고할만한 제이쿼리 함수 아시면 소개 부탁드립니다.

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
8년 전

// view.skin.php 하단 삽입

로그인 후 평가할 수 있습니다

답변에 대한 댓글 8개

s
sinbi
8년 전
언제나 슈와이 님이 도와주시는군요. 감사합니다. ^^
선 채택, 후 적용 후 ....증상 남길게요. ^^
s
sinbi
8년 전
그누5 원본이 아니라 배추베이직이다보니, 위 코드가 적용이 안 되는 것 같네요.

예를 들어,
https://homzzang.com/b/g5-17 페이지를 모바일 버전으로 볼 경우 인뎅...
아래처럼 선택자 부분을 변경해줘봤는데도 작동이 안 되는 것 같아요.


<script>
$('#mw_basic .mw_basic_view_content').children().each( function() {
var pt =$(this).html().replace(/.+font-size:(\d+)pt.+/g, '$1');
if (!isNaN(pt) && Math.floor($(this).css('line-height').replace('px', '') * 3 / 4) < pt)
$(this).css('line-height', pt + 'pt');
});
</script>
슈와이
8년 전
어느 부분이 글자가 겹치나요?
s
sinbi
8년 전
파일질라 FTP 접속법 및 화면 구조 설명

24px 정도로 키운 글자들은 그럭저럭 모바일에서도 볼만 한데,
36px나 48px 정도로 키운 글자들은 겹쳐 나오네요.
슈와이
8년 전
<script>
$('#mw_basic .mw_basic_view_content font').each( function() {
if ( $(this).attr('size') > 4) $(this).css('line-height', '1.2em');
});
</script>
s
sinbi
8년 전
위 코드를 넣으니 아주 잘 되네요. 감사합니다. ( ^ __________ ^) ====b

그런데,

본문에 <font size="6"> 처럼 폰트 태그로 글자 크기가 지정된 게 있는가 하면,
또, 어떤 건 <span style="font-size:48px"> 처럼 이렇게 지정된 애들이 있어요.
알려주신 코드를 참고해, 아래처럼 해봤는데 안 되네요.
이 경우엔 어떤 식으로 조건은 주는지?

$('#mw_basic .mw_basic_view_content span').each( function() {
if ( $(this).attr('font-size') > 30) $(this).css('line-height', '3em');
});
슈와이
8년 전
<script>
$('#mw_basic .mw_basic_view_content font').each( function() {
if ( $(this).attr('size') > 4) $(this).css('line-height', '1.2em');
});
$('#mw_basic .mw_basic_view_content span').each( function() {
var px = $(this).css('font-size').replace('px', '');
if (px > 35) $(this).css('line-height', '1.2em');
});
</script>
s
sinbi
8년 전
슈와이 님, 감사합니다. 위 코드 넣으니 아주 잘 작동하네요.
덕분에 몇 년 동안 묵혀두었던 고민을 해결해 버렸네요.
정말 감사합니다. 덕분에 신기한 코드 구경 많이 했습니다.
( ^ __________ ^ ) ============================b

댓글을 작성하려면 로그인이 필요합니다.

y
8년 전

css에서 line-height:1.5; 정도 주면 되지 않을지요.

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

s
sinbi
8년 전
에디터에서 글자 크기를 다양하게 선택하다 보니,,,, 하나로 고정하면 안 돼서요.
슈와이 님 방법 안 되면, 달콤별 님 방법도 모색해 보도록 할게요. 답변 감사합니다.

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인