IT박스

하프 스페이스, 엠 스페이스, 엔 스페이스와 같은 다른 공백 코드가 HTML에 유용합니까?

itboxs 2020. 7. 13. 21:44
반응형

하프 스페이스, 엠 스페이스, 엔 스페이스와 같은 다른 공백 코드가 HTML에 유용합니까?


HTML 뉴스 레터에 사용할 수있는 다른 코드가 있는지 궁금합니다.

셀 패딩이나 여백을 사용하지만이 HTML / CSS에 익숙하지 않으며 기본 제목 줄과 그 아래에있는 서브 헤드 모두에 영향을 미치는 변경 사항을 찾을 수 없습니다. 이메일이기 때문에 인라인 마크 업이 아닌 CSS 방식에서 어떤 이메일 클라이언트가 마음에 들지 않는지 모르겠 기 때문에 CSS를 사용하는 것이 주저합니다.

맥락에서 내가 사용하는 템플릿은 Mailchimp snip의 Mute 테마입니다.

    <!-- language: lang-html -->
<table cellspacing="0" cellpadding="0" border="0" align="center" width="626">
    <tbody>
        <tr>
            <td valign="middle" bgcolor="#546781" height="97" background="images/header-bg.jpg" style="vertical-align: middle;">
                <table cellspacing="0" cellpadding="0" border="0" align="center" width="555" height="97">
                    <tbody>
                        <tr>
                            <td valign="middle" width="160" style="vertical-align:middle; text-align: left;">
                                <img width="70" height="70" src="http://dl.dropbox.com/…….png" style="margin:0; margin-top: 4px; display: block;" alt="" />
                            </td>
                            <td valign="middle" style="vertical-align: middle; text-align: left;">
                                <h1 class="title" style="margin:0; padding:0; font-size:30px; font-weight: normal; color: #192c45 !important;">
                                    <singleline label="Title"><span>Title of Report</span></singleline>
                                </h1>
                                <h1 class="title" style="margin:0; padding:0; font-size:15px; font-weight: normal; color: #192c45 !important;">
                                    <singleline label="Title"><span>Small Subhead</span></singleline>
                                </h1>
                            </td>
                            <td width="55" valign="middle" style="vertical-align:middle; text-align: center;">
                                <h2 class="date" style="margin:0; padding:0; font-size:13px; font-weight: normal; color: #192c45 !important; text-transform: uppercase; font-weight: bold; line-height:1;">
                                    <currentmonthname />December
                                </h2>
                                <h2 class="date" style="margin:0; padding:0; font-size:23px; font-weight: normal; color: #192c45 !important; font-weight: bold;">
                                     <currentyear />2011
                                </h2>
                            </td>

                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>

웹 페이지로서의 전체 이메일은 여기에서 볼 수 있습니다


예, 많은 .

다음을 포함하지만 이에 국한되지는 않습니다.

  • 비 파괴 공간 : &#160;또는&nbsp;
  • narrow no-break space : &#8239; (no character reference available)
  • en space : &#8194; or &ensp;
  • em space : &#8195; or &emsp;
  • 3-per-em space : &#8196; or &emsp13;
  • 4-per-em space : &#8197; or &emsp14;
  • 6-per-em space : &#8198; (no character reference available)
  • figure space : &#8199; or &numsp;
  • punctuation space : &#8200; or &puncsp;
  • thin space : &#8201; or &thinsp;
  • hair space : &#8202; or &hairsp;

span{background-color: red;}
<table>
<tr><td>non breaking space:</td><td> <span>&#160;</span> or <span>&nbsp;</span></td></tr>
<tr><td>narrow no-break space:</td><td> <span>&#8239;</span></td></tr>
<tr><td>en space:</td><td> <span>&#8194;</span> or <span>&ensp;</span></td></tr>
<tr><td>em space:</td><td> <span>&#8195;</span> or <span>&emsp;</span></td></tr>
<tr><td>3-per-em space:</td><td> <span>&#8196;</span> or <span>&emsp13;</span></td></tr>
<tr><td>4-per-em space:</td><td> <span>&#8197;</span> or <span>&emsp14;</span></td></tr>
<tr><td>6-per-em space:</td><td> <span>&#8198;</span></td></tr>
<tr><td>figure space:</td><td> <span>&#8199;</span> or <span>&numsp;</span></td></tr>
<tr><td>punctuation space:</td><td> <span>&#8200;</span> or <span>&puncsp;</td></tr>
<tr><td>thin space:</td><td> <span>&#8201;</span> or <span>&thinsp;</span></td></tr>
<tr><td>hair space:</td><td> <span>&#8202;</span> or <span>&hairsp;</span></td></tr>
</table>


There are codes for other space characters, and the codes as such work well, but the characters themselves are legacy character. They have been included into character sets only due to their presence in existing character data, rather than for use in new documents. For some combinations of font and browser version, they may cause a generic glyph of unrepresentable character to be shown. For details, check my page about Unicode spaces.

So using CSS is safer and lets you specify any desired amount of spacing, not just the specific widths of fixed-width spaces. If you just want to have added spacing around your h2 elements, as it seems to me, then setting padding on those elements (changing the value of the padding: 0 settings that you already have) should work fine.


Not sure if this is what you're referring to, but this is the list of HTML entities you can use:

List of XML and HTML character entity references

Using the content within the 'Name' column you can just wrap these in an & and ;

E.g. &nbsp;, &emsp;, etc.


What about normal encoded white-space character?

&#32;

I used this Unicode Decimal Code &#8204; and worked. more details

참고URL : https://stackoverflow.com/questions/8515365/are-there-other-whitespace-codes-like-nbsp-for-half-spaces-em-spaces-en-space

반응형