码迷,mamicode.com
首页 > 其他好文 > 详细

图片标签 与 块级和行级标签

时间:2018-04-29 11:53:09      阅读:160      评论:0      收藏:0      [点我收藏+]

标签:块级元素   鼠标悬停   span   --   一个   宽高   共享   OLE   set   

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>04图片标签</title>
</head>
<body>

<!--图片标签 img
width,height:宽高,单位是像素 px
alt:无法显示图片,讲显示该文字
title:鼠标悬停图片上方显示的图片描述
-->
<img src="img/ads.jpg"
width="200px" height="200px"
alt="这是一个表情图"
title="查看源图片"/>
<hr />
<img src="http://img4.imgtn.bdimg.com/it/u=1665207864,746409922&fm=27&gp=0.jpg"/>

    块级标签:独占一行 div:块
<br />
行级标签:和其它标签共享一行 span:行
<p>家事国事天下事,</p>
事事关心。
<a href="">aaa</a>
<a href="">bbb</a>
<!--块级元素独占一行-->
<div style="background-color: brown;width: 400px;height: 200px;">
看看是啥样子的
</div>
<div style="background-color: blueviolet;width: 400px;height: 200px;">
看看是啥样子的
</div>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;我的名字是<span style="color: blue;font-size: 40px;">刘某</span>,今年23岁,性别?你猜!


</body>
</html>

图片标签 与 块级和行级标签

标签:块级元素   鼠标悬停   span   --   一个   宽高   共享   OLE   set   

原文地址:https://www.cnblogs.com/BLAST/p/8970413.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!