Jump to content
  • Hello visitors, welcome to the Hacker World Forum!

    Red Team 1949  (formerly CHT Attack and Defense Team) In this rapidly changing Internet era, we maintain our original intention and create the best community to jointly exchange network technologies. You can obtain hacker attack and defense skills and knowledge in the forum, or you can join our Telegram communication group to discuss and communicate in real time. All kinds of advertisements are prohibited in the forum. Please register as a registered user to check our usage and privacy policy. Thank you for your cooperation.

    TheHackerWorld Official

HTML5网页设计基础——图文混排升级版

 Share


NedK7

Recommended Posts

?i=91300e57a2424cb2832f9cbc2f12c165.png?

代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
	<style>
		#one{
			font-family:"微软雅黑"	/*设置字体*/
		}
		.hui{
			color: #999;
		}
		h2{		
		letter-spacing: 5px /*设置标题字间距*/
		}
		.red{
			color: red;
		}
		.blue{
			color:#05A9F2;
		}
		.center{
			text-align: center;/*标题居中*/
		}
		img{
			margin:0px 30px;	/*给图片上下外边距设置为0左右外边距设置为30*/			
		}
		p{
			white-space: nowrap;/*设置空格空行无效,强制文本不能换行*/
		}
		em{
			white-space: nowrap;/*设置空格空行无效,强制文本不能换行*/ 
		}
	</style>
</head>

<body>
	
	<spen class="center">
		<h2 class="hui">把握<font class="blue">移动端字体设计</font>的七大准则</h2>
	</spen>
	<spen class="center" id="one">
		<p class="hui">更新时间:
			<font class="blue">2020年06月06日17时26分</font>
			&emsp;来源:
			<font class="blue">问答精灵</font>
		</p>
	</spen>
	<span>
		<img src="2.jpg" align="left">
		<p>♠&nbsp;<font class="red">留足空间,字体并非穹曲曲的线条排列</font>,它主要在于周围和相互间的空间。</p>
		<p>♠&nbsp;行宽是行文字的长度,<font class="red">是一行文字的理想长度</font>,因为很难让每行都精确吻合,</p>
		<p>♠&nbsp;行距是行之间的空间,行距太紧凑,<font class="red">会让视线难以从行尾扫视到下一行首。</font></p>
		<p>♠&nbsp;所有字体至少都有一种最佳状态, <font class="red">使字体在浏览器中最能保持字形的抗据齿选项。</font></p>
		<p>♠&nbsp;你读的多数内容是<font class="red">居左对齐,右边沿参差不齐的</font>,这样看起来<font class="red">更有节奏。</font></p>
		<p>♠&nbsp;增强文字与背景对比的同时,我们也要<font class="red">减少不同层次文字间的反差。</font></p>
		<p>♠&nbsp;<font class="red">按比例调整字问距</font>,为移动端调整字号时,要意识到字间距发生了必要的变化。</p>		
		<hr size="2" color="#E3E3E3"  >
		<em class="hui">
			原文链按:
			<em class="blue">http://www.woshipm.compd/136680.html</em>
			&emsp;&emsp;&emsp;文章分类:
			<em class="blue">艺术设计</em>
		</em>	
	</span>
</body>
</html>
Link to post
Link to comment
Share on other sites

 Share

discussion group

discussion group

    You don't have permission to chat.
    • Recently Browsing   0 members

      • No registered users viewing this page.
    ×
    ×
    • Create New...