|
1.1 案例二：网站图片页面显示：1.1.1 需求： 在一个页面中往往图文并茂.想在HTML中引入一个图片如何处理? 效果如下: 1.1.2 分析:1.1.2.1 技术分析:【HTML的图片标签】 [mw_shl_code=applescript,true]图片标签:<img>
* 属性:
* src :图片的来源.
* width :图片的宽度.
* height:图片的高度.
* alt :图片找不到显示的内容.
图片的引入的路径问题:
* 路径：相对路径.
* 如果引入的图片和html文件在同一级路径。
* 直接写文件名或者./文件名
<img src="cs10006.jpg" />
<img src="./cs10006.jpg" />
* 如果引入的图片在html文件的上一级路径。
* <img src="../cs10006.jpg" />
* 如果引入的图片在html文件的下一级路径。
* <img src="img/cs10006.jpg" />
[/mw_shl_code] 【步骤一】创建一个html的文档 【步骤二】引入两张图片显示到页面 1.1.3 代码实现：[mw_shl_code=applescript,true]<img src="logo2.png" height="50" width="200"/>
<img src="header.png" height="50" width="250"/>[/mw_shl_code] 在网站的友情链接页面显示网站的所有的友情链接. 1.2.2 分析：1.2.2.1 技术分析：【HTML的列表标签】 l 有序列表 [mw_shl_code=applescript,true]<ol>
<li></li>
</ol>
l 无序列表
<ul>
<li></li>
</ul>
【HTML的超链接标签】
HTML的超链接标签：<a>
* 属性:
* href :链接的路径
* target :打开的方式
* _self :在自身页面打开
* _blank :新打开一个窗口[/mw_shl_code] 【步骤一】创建一个html的文档 【步骤二】创建一个无序列表 【步骤三】在无序列表中添加超链接标签. 1.2.3 代码实现：[mw_shl_code=applescript,true]<ul>
<li><a href="../案例一：网站信息页面的显示/案例一：网站信息页面的显示.html">传智播客</a></li>
<li><a href="http://www.baidu.com" target="_self">百度</a></li>
<li><a href="http://www.163.com" target="_blank">网易</a></li>
<li>百合</li>
</ul>[/mw_shl_code] [mw_shl_code=applescript,true]无序列表的属性:
* type属性
* disc ：实心点.
* circle ：空心圆
* square ：方块.
有序列表的属性:
* type属性:
* 1 ：数字类型
* a ：英文类型
* i ：罗马字符
* start属性:从哪开始
超链接的target属性:
* _self
* _blank
* _parent[/mw_shl_code]
| 
收藏
淘帖
踩
