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

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

QA

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

본문

설정하는 방법 있을까요?


예를 들어,


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

<span style="font-family:verdana;font-size:36px;;">그누보드</span>


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


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

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


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

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

이 질문에 댓글 쓰기 :

답변 2

// view.skin.php 하단 삽입

<script>

$('#bo_v_con').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>


그누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>

위 코드를 넣으니 아주 잘 되네요. 감사합니다. ( ^ __________ ^) ====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');
 });

<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>

슈와이 님,  감사합니다. 위 코드 넣으니 아주 잘 작동하네요.
덕분에 몇 년 동안 묵혀두었던 고민을 해결해 버렸네요.
정말 감사합니다. 덕분에 신기한 코드 구경 많이 했습니다.
( ^ __________ ^ ) ============================b

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

답변을 작성하시기 전에 로그인 해주세요.
전체 10
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT