为了账号安全,请及时绑定邮箱和手机立即绑定

信息列表制作

难度初级
时长 2小时 0分
学习人数
综合评分9.50
77人评价 查看评价
9.8 内容实用
9.6 简洁易懂
9.1 逻辑清晰
  • 3.以下哪个是javascript中鼠标移入、移出事件? javascript事件有 "on" ,jQuery没有"on" Conmouseover、onmouseout
    查看全部
    0 采集 收起 来源:练习题

    2018-03-22

  • 2.使用JavaScript如何获取文档中标签LI元素? C document.getElementsByTagName("li")
    查看全部
    0 采集 收起 来源:练习题

    2018-03-22

  • 1.JavaScript中如何通过ID(ID名为DIV)获取元素? 通过ID获取元素的方法document.getElementById("元素id名")
    查看全部
    0 采集 收起 来源:练习题

    2018-03-22

  • 利用javascript完成鼠标移入和移出效果:此时的展示效果是被隐藏的即display:none; 当鼠标移入到li上,dl展示下拉效果,onmouseover为鼠标移入事件,getElementById('oDl') <ul> <li onmouseover="dl.style.display='block'"><span>*</span>舌尖上的中国 <dl><dt>……</dt></dl> </li> </ul> 如何获取我想要的Dl呢?首先给要展示的dl定义,<dl id=“oDl”> <dt>……</dt></dl>然后要让li能准确获取列表内容 即<ul> <li onmouseover="document.getElementById('oDl').style.display='block'"><span>*</span>舌尖上的中国 <dl><dt>……</dt></dl> </li> </ul> 鼠标移出事件:onmouseout让鼠标移出的时候使dl的display='none' 直接在<li>里的onmouseover后面加上对onmouseout的定义,即<li onmouseover="……" onmouseout="document.getElementById('oDl').style.display='none'">……</li> 简便方法:javascript的调用 在style里面设置<script></script> <script> function showDl() {document.getElementById('oDl').style.display='block'}(显示下拉列表)function hideDl() {document.getElementById('oDl').style.display='none'}(隐藏列表)</script> 然后在li里使用简便调用实现显示和隐藏,即<li onmouseover="showDl()" onmouseout="hideDl()">……</li> 注意:每定义一个名字都要加一个function,id的名字和show/hide的名字要对应且避免重复
    查看全部
  • list-style:none // 不显示 list-style-type:circle // 显示不同样式的 list-style-img: //用图片 list-style-position: inside // 显示在内部还是外部,ul的内部或者外部
    查看全部
    0 采集 收起 来源:普通信息列表

    2017-04-09

  • 记得做题
    查看全部
    0 采集 收起 来源:实践题

    2017-03-22

  • *{margin:o;padding:0;} .list{…… margin:0 auto;(列表居中)} h3{line-height(垂直居中):24px;font-size(字号):24px;} ul li{list-style-type(列表用什么显示):默认为实心点 可改为square(方框)/circle(空心圆);list-style-image(列表图标);list-style-position(实心点的位置) 默认为outside在大框框外面} ul li{list-style:none;一般为了兼容性 把默认的系统(点)给去掉 border-bottom:1px dotted #ccc:可用于设置每一行字下面用灰色的虚线来隔开height:24px;line-height:24px;设置和标题一样的高度并垂直居中} 给li加小图标时可以直接在ul li里设置,也可以在body里的li里设置 ,在li里加内联元素span, 内联元素设置宽高是不起作用的,要有用可以在ul li span设置里添加上display:inline-block;利用text-align:center;line-height:20px;把小方框里的图居中显示
    查看全部
    0 采集 收起 来源:普通信息列表

    2015-02-26

  • 可以
    查看全部
    0 采集 收起 来源:普通信息列表

    2018-03-22

  • <script> function showDL(obj){ var aDl = obj.getElementsByTagName('dl')[0]; aDl.style.display='block'; } function hideDL(obj){ var aDl=obj.getElementsByTagName('dl')[0]; aDl.style.display='none'; } </script> <li onmouseover="showDL(this)" onmouseout="hideDL(this)">舌尖上的中国 <dl id="oDL"> <dt>舌尖上的中国</dt> <dd>作者,本书编写组</dd> <dd>价格:$8.94</dd> </dl> </li> <li onmouseover="showDL(this)" onmouseout="hideDL(this)">舌尖上的中国 <dl> <dt>舌尖上的中国</dt> <dd>作者,本书编写组</dd> <dd>价格:$8.94</dd> </dl> </li>
    查看全部
  • list-style-position(实心点的位置) 默认为outside在大框框外面,insite在框框里面,先list-style:none;去掉所有的默认属性(浏览器兼容)
    查看全部
    0 采集 收起 来源:普通信息列表

    2016-11-17

  • 内联元素的特点:宽高,padding和margin不会起作用 想让内联持有自己的属性,还要有块级元素的效果 设置属性 display:inline-block;
    查看全部
    0 采集 收起 来源:普通信息列表

    2016-11-17

  • $(this).children('dl') 获取当前元素下的元素。
    查看全部
  • 内联元素的特点:宽高,padding和margin不会起作用 想让内联持有自己的属性,还要有块级元素的效果 设置属性 display:inline-block;
    查看全部
    0 采集 收起 来源:普通信息列表

    2016-10-10

  • 踩踩踩踩踩踩踩踩踩
    查看全部
  • 顶顶顶顶顶顶顶
    查看全部

举报

0/150
提交
取消
课程须知
1. 您至少具备HTML基础知识,如<ul>、<li>、<a>、<dl>、<dt>、<dd>等标签; 2. 您至少熟悉JavaScript基础知识,如何插入JS代码、利用鼠标事件、获取DOM元素; 3. 您至少熟悉jQuery基础知识,如何引用jQuery库,了解语法;
老师告诉你能学到什么?
拉风的信息列表,带超链接效果、带高亮效果和带手风琴效果,运用CSS样式、JavaScript和jQuery三种方法现实带手风琴效果的信息列表。

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!