2011-03-18 5 views
16

누구든지 WebKit 브라우저에서 하이픈 넣기를 성공적으로 구현할 수 있습니까? 나는 -webkit-hyphens: auto뿐만 아니라 CSS3 hyphenation 스타일을 시도했다. 그 중 하나의 주사위는 없습니다. 아니면 뭔가 잘못하고있는 걸까요?WebKit 하이픈 넣기

참고 : Mac에서만 Safari와 Chrome을 사용해 보았습니다.

업데이트 : 코드 예제

<html> 
    <head> 
    <style> 
     div { 
     -webkit-hyphens: auto; 
     } 
    </style> 
    </head> 
    <body> 
    <div style="width: 150px; border: solid 1px black;"> 
     <p>Anaideia, spirit of ruthlessness, shamelessness, and unforgivingness</p> 
     <p>Supercalifragilisticexpialidocious, Antidisestablishmentarianism, Floccinaucinihilipilification, Hippopotomonstrosesquipedaliophobia</p> 
    </div> 
    </body> 
</html> 
+0

어디에서 구현하려고합니까? 예를 들어 사용중인 텍스트를 제공 할 수 있습니까? –

+0

다음은이 코드에 대한 링크입니다 (웹킷은 올바르게 입력되어 있습니다 :)) http://jsbin.com/ihama4/2/ –

+0

어떻게 그 긴 단어를 생각해 냈습니까? 나는 오직 처음 만 들었다. Supercalifragilisticexpialidocious –

답변

25

-webkit-하이픈은 위의 아이폰 OS 4.2에서 잘 작동하고, 부분적으로 웹킷 나이틀리에서 지원됩니다.

웹킷 :

Webkit

아이폰 OS 4.3 : 그것은,하지와 (OS X 라이온 사파리 5.1, 테스트 및 아이 패드에 사파리 모바일) Safari에서 작동

iOS 4.3

+2

+1 스크린에 대한 설명 화면 –

+1

2015 년까지 전혀 사용하지 마십시오 : http://caniuse.com/#feat=css-hyphens –

+0

왜 데스크톱과 Safari 9 모두에서 여전히 -webkit- 접두어를 사용하며 다른 브라우저도 접두어가 붙지 않습니다. –

12

아직 크롬. 하이픈 브라우저 지원에 대해서는 http://caniuse.com/css-hyphens을 참조하십시오. 큰 아뇨이었다 브라우저에서

p { 
    hyphens:auto; 
    text-align:justify; 
    -webkit-hyphens:auto; 
    -webkit-hyphenate-character:"\2010"; 
    -webkit-hyphenate-limit-after:1; 
    -webkit-hyphenate-limit-before:3; 
    -moz-hyphens:auto; 
} 

(마지막 줄은 파이어 폭스입니다)

그래서 정렬 텍스트 : 여기

단락이 320 최대 프로젝트 (http://www.stuffandnonsense.co.uk/projects/320andup/)에서 스타일하는 방법입니다 천천히 현실이되고있다.

3

더 나은 날이 올 것입니다. Editors working draft을 탐색 한 후 - 제공된 인스턴스에서 더 나은 속성이 '오버플로 랩'이라고 생각합니다. '하이픈 :'은 일반적으로 일반적인 서식 요구 사항에 더 적합하지만 오버플로 랩은 긴급한 단어가 포함 된 긴급한 경우에 사용됩니다. 하이픈도 작업 초안에없는 : 가장 좋은 값은

* { 
overflow-wrap:hyphenate. 
} 

아아 오버 플로우 랩 doesen't은 아이폰이나 파이어 폭스, 오버 플로우 랩에 아직 어떤 방식으로 지원 될 것으로 보인다 될 것이다. (sadface)