HTML5第三天 无序有序列表、相对绝对路径

ol：有序列表          ul：无序列表            li：列表项

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>2020年11月4号 ul ol</title>
    <style>
     /*此处是css样式，看不懂可以先忽略*/
	ol>li>ul>li{
		width:100px;
		margin-bottom:10px;
		background:red;
		list-style:none;   /* 去除无序列表中列表项的小黑点 */
	}
  </style>
 </head>
 <body>
  <ol>   <!-- ol:有序标签    li:列表项 -->
	<li><font face="楷书" color="blue" size="12px">胡歌</font>
		<ul>   <!-- ul:无序标签 -->

			<li>32</li>
			<li>男</li>
			<li>琅琊榜</li>
		</ul>
	</li>

	<li><font face="楷书" color="blue" size="12px">陈坤</font>
		<ul>
			<li>33</li>
			<li>男</li>
			<li>画皮</li>
		</ul>
	</li>

	<li><font face="楷书" color="blue" size="12px">张震</font>
		<ul>
			<li>34</li>
			<li>男</li>
			<li>绣春刀</li>
		</ul>
	</li> 
  </ol>

<!-- 相对路径：以文件自身为坐标，分同级或上级     ./ :同级目录，可以省略，  ../:上级目录，不可省略      绝对路径：不以任何文件为坐标对比，路径从盘的根目录开始写 -->
 <!-- 相对路径 -->
 <img src="./img/img1.jpg" width="200px" high="200px" align="left"/>
 <img src="../img/img1.jpg" width="200px" high="200px" align="left"/>
 <!-- 绝对路径 -->
 <img src="G:\img\india\100.jpg" width="200px" high="200px" align="left"/>
 </body>
</html>

 

posted @ 2020-11-10 10:35  橙汁one  阅读(148)  评论(0)    收藏  举报