HTML5网页设计基础——美食专题栏目

无聊玩玩~

已于 2022-01-25 20:26:55 修改

阅读量2.9k

点赞数 7

文章标签： html css webview html5 网页设计

于 2022-01-22 20:07:03 首次发布

本文链接：https://blog.youkuaiyun.com/shengming_tutou/article/details/122642636

版权

案例：

图片资源：

参考代码：如下

<!doctype html>
<html>
<head>
	<style>
		img{
			margin:20px/*设置图片的四边为20像素*/

		}
		p{
			font-size: 20px;	/*所有p标签的文字大小设置为20px*/
			line-height: 30px;	/*行高为30像素*/
			text-indent: 2em;	/*设置首行缩进为两个字符的空格*/
		}
		em{
			color: blue;	/*斜体文字颜色改为黑色*/		
		}
		strong{
			color: red；	/*加粗文字颜色改为红色*/
		}
		.number{
			font-size: 30px /*给类名为number的标签设置字体大小*/
		}
	</style>
<meta charset="utf-8">
<title>美食专栏</title>
</head> 

<body>
	<img src="meishi.jpg"/>
	<p>
		<em>导语</em>
	:臭豆腐是
		<strong>&nbsp;长沙&nbsp;</strong >
		有名的小吃，是一种独具风味的食品。“闻起来臭、吃起来香”是它的最大特点,不少外省人品尝后都赞不绝口。长沙的臭豆腐要数百年老店火宫殿炸得最好外焦微脆、内软味鲜,100多年来，进火宫殿的人没有不吃臭豆腐的。当年... 
		<em>[详情]</em>
	</p>
	<p>
		<em>火宫殿臭豆腐</em>
		:价格
		<strong  class="number">&nbsp;18&nbsp;</strong >
		元
	</p>
	
</body>
</html>