Created
May 13, 2013 07:14
-
-
Save kejun/5566638 to your computer and use it in GitHub Desktop.
一个普通英文半角空格的宽度
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
body { | |
margin: 0; | |
padding: 0 24px; | |
font-family: arial, sans-serif; | |
background-color: #0ff; | |
background-image: linear-gradient(90deg, transparent 1px, rgba(255,255,255,.9) 1px); | |
background-size: 5px 5px; | |
} | |
hr { | |
border: none;margin:1em 0; | |
} | |
p { | |
font-size: 12px; | |
margin:0; | |
} | |
h1, h2 { | |
margin: 20px 0; | |
font-size: 12px; | |
color: #00b; | |
font-weight: normal; | |
} | |
ul { | |
margin: 0 0 20px 0; | |
padding:0; | |
} | |
li { | |
text-align: left; | |
list-style: none; | |
} | |
/* | |
一个普通英文半角空格的宽度 | |
根据排版在1/5~1/3em(0.2~0.33)之间变化。0.31是个经验值。 | |
*/ | |
.space-width { | |
letter-spacing:.31em; | |
} | |
@-moz-document url-prefix() { | |
.space-width { | |
letter-spacing:.28em; | |
} | |
} | |
#sample1 { | |
font-size: 12px; | |
} | |
#sample2{ | |
font-size: 14px; | |
} | |
#sample4{ | |
font-size: 18px; | |
} | |
#sample5{ | |
font-size: 24px; | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<h2>EM空格、EN空格、THIN空格宽度</h2> | |
<p>D O U B A N | |
<p style="letter-spacing:1em">DOUBAN | |
<hr> | |
<p>D O U B A N | |
<p style="letter-spacing:.5em">DOUBAN | |
<hr> | |
<p>D O U B A N | |
<p style="letter-spacing:0.31em;">DOUBAN | |
<hr> | |
<p>D O U B A N | |
<p style="letter-spacing:0.2em;">DOUBAN | |
<h2>英文半角空格宽度: | |
根据排版在1/5~1/3em(0.2~0.33)之间变化。0.31是个经验值(Firefox, Mobile Safari空格偏大)。 | |
</h2> | |
<ul id="sample1"> | |
<li>1 2 , a b c M M M . 田 田 田 | |
<li class="space-width">12,abcMMM.田田田 | |
</ul> | |
<ul id="sample2"> | |
<li>1 4 , a b c M M M . 田 田 田 | |
<li class="space-width">14,abcMMM.田田田 | |
</ul> | |
<ul id="sample3"> | |
<li>1 6 , a b c M M M . 田 田 田 | |
<li class="space-width">16,abcMMM.田田田 | |
</ul> | |
<ul id="sample4"> | |
<li>1 8 , a b c M M M . 田 田 田 | |
<li class="space-width">18,abcMMM.田田田 | |
</ul> | |
<ul id="sample5"> | |
<li>2 4 , a b c M M M . 田 田 田 | |
<li class="space-width">24,abcMMM.田田田 | |
</ul> | |
<h2>UNICODE标准中有20种空格</h2> | |
<a href="http://www.cs.tut.fi/~jkorpela/chars/spaces.html" target="_blank">http://www.cs.tut.fi/~jkorpela/chars/spaces.html</a> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// alert('Hello world!'); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{"view":"separate","fontsize":"70","seethrough":"","prefixfree":"1","page":"result"} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment