Web前端开发技术项目教程（HTML5 CSS3 JavaScript）（微课版） 课件 6.1.2知识点1：创建列表_第1页
Web前端开发技术项目教程（HTML5 CSS3 JavaScript）（微课版） 课件 6.1.2知识点1：创建列表_第2页
Web前端开发技术项目教程（HTML5 CSS3 JavaScript）（微课版） 课件 6.1.2知识点1：创建列表_第3页
Web前端开发技术项目教程（HTML5 CSS3 JavaScript）（微课版） 课件 6.1.2知识点1：创建列表_第4页
Web前端开发技术项目教程（HTML5 CSS3 JavaScript）（微课版） 课件 6.1.2知识点1：创建列表_第5页
已阅读5页，还剩14页未读， 继续免费阅读

付费下载

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

创建列表信息安全技术应用ApplicationofInformationSecurityTechnology《前端技术开发》前端技术开发知识储备列表应用1创建无序列表2创建有序列表3列表样式属性401列表的常见应用01列表常见应用第1处.无序列表第2处.有序列表第3处.无序列表列表的特点呈多项并列关系的元素信息整齐直观，便于用户理解。案例：智慧职教网站页面列表常见应用水平导航栏

侧边栏

轮播插件的小图标02创建无序列表02列表类型HTML列表类型：列表名称描述相关标记无序列表无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。<ul>创建列表，<li>列表项有序列表有序列表是一列项目，列表项目使用数字进行标记。<ol>创建列表，<li>列表项定义列表自定义列表不仅仅是一列项目，而是项目及其注释的组合。<dl>创建定义列表，<dt>列表项，<dd>定义定列表项的描述注意和提示：列表项内部可以使用段落、换行符、图片、链接以及其他列表等等02创建无序列表创建无序列表HTML代码：<ul>

<li>第一个列表项内容</li> <li>第二个列表项内容</li>

<li>第三个列表项内容</li>…</ul>说明：

无序列表以<ul>开始，</ul>结束。

<li></li>标记生成一个列表项

数量根据需要而定

无序列表的默认项目符号为实心圆点

可使用CSS修改样式。02创建无序列表网页源代码网页效果默认实心圆03创建有序列表说明：

无序列表以<ol>开始，</ol>结束。

<li></li>标记生成一个列表项

数量根据需要而定

有序列表的默认项目符号为数字

可使用CSS修改样式。03创建有序列表创建有序列表HTML代码：<ol>

<li>第一个列表项内容</li> <li>第二个列表项内容</li>

<li>第三个列表项内容</li>

…</ol>03创建有序列表HTML源代码网页效果默认数字03嵌套列表列表项内容可以是文本，图片，超链接，甚至可以是列表等其他网页元素。列表项内容是列表，形成嵌套列表。嵌套列表HTML源代码网页效果04列表样式属性列表属性样式设置前端技术开发04设置列表项类型的CSS属性——list-style-type属性list-style-type属性值常用值列表属性样式设置前端技术开发04设置列表项类型的CSS属性——list-style-type属性ul{list-style-type:square;}ol{list-style-type:upper-alpha;}无序列表符号为方块有序列表符号为大写字母属性样式设置前端技术开发02设置列表项图片的CSS属性list-style-image：none|URL(图片路径)说明：none是默认值。表示不设置图片。URL指定图片源。一般使用相对路径来指定本地图片。图片常用格式有GIF、PNG、JPEG（JPG）等。属性样式设置前端技术开发02设置列表项图片的实例HTML源代码网页效果

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论