HTML의 텍스트 줄바꿈 분석 예(이미지와 텍스트의 HTML 혼합 배열)

텍스트를 단어로 묶는 방법을 알고 있는데 웹페이지에서 구현하는 방법은 무엇인가요? 이것은 말처럼 쉽지 않습니다. 그러나 좋은 HTML 요소를 사용하는 한 여전히 이 효과를 얻을 수 있습니다. 일반적으로 그림 주위의 텍스트 감싸기, 텍스트 주위의 텍스트 감싸기 등 여러 가지 유형의 감싸기가 있습니다. 제가 이야기하고 싶은 것은 이 두 가지입니다. 자, 시작하겠습니다

1. 텍스트 줄 바꿈

일반적인 텍스트를 사용하는 경우 예를 들면 다음과 같습니다.

코드는 다음과 같습니다.

<TABLE cellpadding="15" width="200">
<TR>
<TD bgcolor="#EEEEFF"><IMG src="test.gif" hight=60>这里是普通的。国内的VB网站中vbgood以每日更新，资料量丰富，而深受程序爱好者的喜欢。</TD>
</TR>
</TABLE>

이렇게 문장 속 그림이 본문보다 크면 본문 위에 공백이 생깁니다. 페이지의 효과가 매우 좋지 않습니다. 어떻게 해결하나요? 이 코드를 보십시오:

코드는 다음과 같습니다:

<TABLE cellpadding="15" width="200">
<TR>
<TD bgcolor="#EEEEFF"><IMG src="test.gif" hspace="1" align="LEFT" hight=60>这里是绕排的。国内的VB网站中vbgood以每日更新，资料量丰富，而深受程序爱好者的喜欢。</TD>
</TR>
</TABLE>

문제를 해결하려면 img 요소에 이 속성을 추가하십시오: align="center", 문제는 해결될 것입니다. 간단하게 유지하세요! hspace의 경우 그림과 주변 요소의 너비를 정의합니다. 우회 여부는 중요하지 않습니다.

이 작업은 어떻게 수행되었나요? 먼저 이 코드를 살펴보겠습니다.

코드는 다음과 같습니다.

<table align=left cellspacing=0 cellpadding=0 width=200 border=1>
<tr>
<td><table align=left cellspacing=0 cellpadding=0><font color=red size="5"><b>在</b></font> </table>国内的VB网站中vbgood以每日更新，资料量丰富，而深受程序爱好者的喜欢。（End）</td></tr>
</table>

이 효과를 어떻게 얻을 수 있나요?

코드는 다음과 같습니다.

<table align=left cellspacing=0 cellpadding=0 width=200 border=1>
<tr>
<td><table align=left cellspacing=0 cellpadding=0><font color=red size="5"><b>在</b></font>
</table>国内的VB网站中vbgood以每日更新，资料量丰富，而深受程序爱好者的喜欢。（End）</td></tr>
</table>

이 코드는 똑똑하다면 한 눈에 알고 싶은 단어를 넣으면 됩니다. 이 표를 확대해 보세요.

그런데 이제 텍스트에 배경색을 적용하려면 어떻게 해야 할까요? 하, 정말 똑똑하시군요. 다음과 같이 테이블에 bgcolor 속성을 추가하세요:

코드는 다음과 같습니다:

<table align=left cellspacing=0 cellpadding=0 width=200 border=1>
<tr>
<td><table align=left cellspacing=0 cellpadding=0 bgcolor=#C0C0C0><font color=red size="5"><b>在</b></font></table>国内的VB网站中vbgood以每日更新，资料量丰富，而深受程序爱好者的喜欢。（End）</td></tr></table>

하지만 올 수 있을까요? 밖으로? 아니요, 다음과 같이 뭔가를 추가해야 합니다(다음번에는 너무 빨리 대답하지 마세요 :).

코드는 다음과 같습니다.

<table align=left cellspacing=0 cellpadding=0 width=200 border=1>
<tr>
<td><table align=left cellspacing=0 cellpadding=0 bgcolor=#C0C0C0><td><font color=red size="5"><b>在</b></font></td></table>国内的VB网站中vbgood以每日更新，资料量丰富，而深受程序爱好者的喜欢。（End）</td></tr></table>

추가 HTML 텍스트 Wrapping 배열 예제(혼합 HTML 이미지와 텍스트 배열)의 샘플 분석에 대한 관련 기사는 PHP 중국어 웹사이트에 주목하세요!