温馨提示：由于个人手机设置不同，如果发现不能下载，请复制以下地址【https://www.zixin.com.cn/docdown/4859837.html】到电脑端继续下载（重复下载【60天内】不扣币）。
1、咨信平台为文档C2C交易模式，即用户上传的文档直接被用户下载，收益归上传人（含作者）所有；本站仅是提供信息存储空间和展示预览，仅对用户上传内容的表现方式做保护处理，对上载内容不做任何修改或编辑。所展示的作品文档包括内容和图片全部来源于网络用户和作者上传投稿，我们不确定上传用户享有完全著作权，根据《信息网络传播权保护条例》，如果侵犯了您的版权、权益或隐私，请联系我们，核实后会尽快下架及时删除，并可随时和客服了解处理情况，尊重保护知识产权我们共同努力。 2、文档的总页数、文档格式和文档大小以系统显示为准(内容中显示的页数不一定正确)，网站客服只以系统显示的页数、文件格式、文档大小作为仲裁依据，个别因单元格分列造成显示页码不一将协商解决，平台无法对文档的真实性、完整性、权威性、准确性、专业性及其观点立场做任何保证或承诺，下载前须认真查看，确认无误后再购买，务必慎重购买；若有违法违纪将进行移交司法处理，若涉侵权平台将进行基本处罚并下架。 3、本站所有内容均由用户上传，付费前请自行鉴别，如您付费，意味着您已接受本站规则且自行承担风险，本站不进行额外附加服务，虚拟产品一经售出概不退款（未进行购买下载可退充值款），文档一经付费（服务费）、不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。 4、如你看到网页展示的文档有www.zixin.com.cn水印，是因预览和防盗链等技术需要对页面进行转换压缩成图而已，我们并不对上传的文档进行任何编辑或修改，文档下载后都不会有水印标识（原文档上传前个别存留的除外），下载后原文更清晰；试题试卷类文档，如果标题没有明确说明有答案则都视为没有答案，请知晓；PPT和DOC文档可被视为“模板”，允许上传人保留章节、目录结构的情况下删减部份的内容；PDF文档不管是原文档转换或图片扫描而得，本站不作要求视为允许，下载前可先查看【教您几个在下载文档中可以更好的避免被坑】。 5、本文档所展示的图片、画像、字体、音乐的版权可能需版权方额外授权，请谨慎使用；网站提供的党政主题相关内容(国旗、国徽、党徽－－等)目的在于配合国家政策宣传，仅限个人学习分享使用，禁止用于任何广告和商用目的。 6、文档遇到问题，请及时联系平台进行协调解决，联系【微信客服】、【QQ客服】，若有其他问题请点击或扫码反馈【服务填表】；文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“【版权申诉】”，意见反馈和侵权处理邮箱：1219186828@qq.com；也可以拔打客服电话：4009-655-100；投诉/维权电话：18658249818。
本文（web学习笔记.doc）为本站上传会员【丰****】主动上传，咨信网仅是提供信息存储空间和展示预览，仅对用户上传内容的表现方式做保护处理，对上载内容不做任何修改或编辑。 若此文所含内容侵犯了您的版权或隐私，请立即通知咨信网（发送邮件至1219186828@qq.com、拔打电话4009-655-100或【 微信客服】、【 QQ客服】），核实后会尽快下架及时删除，并可随时和客服了解处理情况，尊重保护知识产权我们共同努力。 温馨提示：如果因为网速或其他原因下载失败请重新下载，重复下载【60天内】不扣币。【 服务填表】
1、1. 元信息标记，定义页面的关键字，页面说明，刷新等。 2.改变链接字的颜色
2、称
3、dy下)锚点 9.滚动 文字，图像 up,down,left,right滚动方向 或文字，图像 alternate来回交替，scroll循环，slide只滚动一次 10.插多媒体
4、 显示播放器 不显示： 11.框架 框架网页：(index.htm) 放在之间或cols()=""> 属性：frameborder="no/yes"framespacing="边框宽度像素"，b
5、ordercolor 常用属性：隐藏滚动条 scrolling=“yes(显示)、no（隐藏）,auto（系统默认由内容调整）” 12.框架链接： 13.浮动的框架： 14.表单 <form type="text" size="12">姓名</form> 属性：action="表单处理程序地址"name="form1"</p><p style='padding:5px 0px;'>6、 method="get(将数据收到url),post" 表单元素：请输入姓名<input type="text" size=“5（字符）” value=“张三（默认）” maxlength="4"(只能输入四个字符)><br> 请输入密码<input type="password" size=“10（字符）” value=“0009（默认）” maxlength="10"(只能输入四个字符)><br> 14.单选按钮 请选择性别<input name="sex" type="radio" value=“男性”checkd>男 <input name="sex" type="rad</p><p style='padding:5px 0px;'>7、io" value=“女性”>女<br> 15.复选框 <input name="yy" type="checkbox" value="游泳"checkd>游泳 <input name="yy" type="checkbox" value="游泳"checkd>游泳 <input name="yy" type="checkbox" value="游泳"checkd>游泳 16. 下拉菜单和列表 请选择学历：<select name="itaok"> <option value="大学" selected(默认值)>大学</option> <option value="小学">小</p><p style='padding:5px 0px;'>8、学</option> <option value="大学">大学</option> </select> 列表： 请选择学历：<select name="itaok" multiple size="2"(显示的数)> <option value="大学" selected(默认值)>大学</option> <option value="小学">小学</option> <option value="大学">大学</option> </select> 17.文本域 请你留言：<textarea name="text" cols="30"(文本域宽度，以列为单位) rows="10</p><p style='padding:5px 0px;'>9、"(文本域高度，以行为单位)></textarea> 爱逃课看到35 css课程 18.图片边框 img.test1{ border-style:dotted(点画线);dashed(虚线) border-color: ; bordre-width: ; } <img ser="" class="test1"> 或 mg.test1{ border-style:dotted(点画线);dashed(虚线) color: ;width: ; } <img ser="" class="test1"> border-left:3px bule; bo</p><p style='padding:5px 0px;'>10、rder-right:3px bule ; 图片的缩放 vertical-align:baseline/bottom/middle/sub/super/text-bottom/text-top/top(竖直对齐) 19.图文混排 span{float:left;（放大首字） marrgin: ; pading-right: : padding-left: ; } <span>春</span> img{float:(文字环绕图片) /*margin-right:50px;（右侧距离） /*margin-left:25px;（下段距离） } 将段落的第一行缩进 5</p><p style='padding:5px 0px;'>11、0 像素： p { text-indent:50px; } <script type="text/javascript"> function setTextIndent() { document.getElementById("div1").style.textIndent="50px"; } </script> 字间隔word-spacing p.spread {word-spacing: 30px;} p.tight {word-spacing: -0.5em;} <p class="spread"> This is a paragraph. </p><p style='padding:5px 0px;'>12、The spaces between words will be increased. </p> <p class="tight"> This is a paragraph. The spaces between words will be decreased. </p> 字符转换 text-transform处理文本的大小写。这个属性有 4 个值： · none · uppercase · lowercase · capitalize 默认值 none 对文本不做任何改动，将使用源文档中的原有大小写。顾名思义，uppercase 和 lowercase 将文本转</p><p style='padding:5px 0px;'>13、换为全大写和全小写字符。最后，capitalize 只对每个单词的首字母大写。 文本装饰 text-decoration 有 5 个值： · none · underline · overline · line-through · blink 不出所料，underline 会对元素加下划线，就像 HTML 中的 U 元素一样。overline 的作用恰好相反，会在文本的顶端画一个上划线。值 line-through 则在文本中间画一个贯穿线，等价于 HTML 中的 S 和 strike 元素。blink 会让文本闪烁，类似于 Netscape 支持的颇招非议的 bli</p><p style='padding:5px 0px;'>14、nk 标记。 none 值会关闭原本应用到一个元素上的所有装饰。通常，无装饰的文本是默认外观，但也不总是这样。例如，链接默认地会有下划线。如果您希望去掉超链接的下划线，可以使用以下 CSS 来做到这一点： 处理空白符 white-space 值 nowrap 与之相对的值是 nowrap，它会防止元素中的文本换行，除非使用了一个 br 元素。在 CSS 中使用 nowrap 非常类似于 HTML 4 中用 <td nowrap> 将一个表单元格设置为不能换行，不过 white-space 值可以应用到任何元素。 值 空白符 换行符 自动换行 pre-line 合并 保留</p><p style='padding:5px 0px;'>15、 允许 normal 合并 忽略 允许 nowrap 合并 忽略 不允许 pre 保留 保留 不允许 pre-wrap 保留 保留 允许 文本方向 direction 属性规定文本的方向 / 书写方向。div { direction: rtl } 可能的值 值 描述 ltr 默认。文本方向从左到右。 rtl 文本方向从右到左。 inherit 规定应该从父元素继承 direction 属性的值。 20.css页面背景 body{backgroung-color: ;(页面背景颜色) margin: </p><p style='padding:5px 0px;'>16、' padding: ; color: ;（页面文字颜色）} p{font-size: ;(正文文字大小) padding-top: ; padding-left: ; line-height: ; } 21.背景 body{padding:0px; margin:0px; background-color: ;(页面背景)} .topbanner{background-color: ;}(顶端banner的背景色) leftbanner{ width:22%; height:330px; vertical-align:top; back</p><p style='padding:5px 0px;'>17、ground-color: ; color: ; padding-left: ; text-align:left; font-size: }(左侧导航条的背景色) mianpart{text-align:center;} 22.背景图的重复及位置 body{padding: ; margin: ; background-image: ;(背景图片) background-repeat:repaer-y;(垂直方向重复) /no-repeat;(不重复) background-color: ; background-position：bottom ri</p><p style='height:0px;padding:0;overflow:hidden'>18、ght；（背景位置，右下） } background-attachment：fixed；（固定背景图片） 23.文字 writing-mode（仅IE）:tb-rl;(竖排文字) 24.控制表格 隔行变色：.datalist tr.altrow{background-color: ;} 表单 元素：<form> <p>请输入您的姓名：<br><input type="text" name="name" id="name"></p> <p>请选择你喜欢的颜色：<br><select name="color" id="color"> <option value="red"></p><p style='height:0px;padding:0;overflow:hidden'>19、红色</option></select></p> </form> 留言 表单还可以嵌套在表格中 折叠边框 border-collapse 属性设置是否将表格边框折叠为单一边框： table {border-collapse:collapse; } table,th, td { border: 1px solid black; } 25.动态超链接 a:link{color: ;(正常状态下的样式) text-decoration:none;（无下划线）} a:visited{ccolor: ;(访问过的) text-decoration:none; </p><p style='height:0px;padding:0;overflow:hidden'>20、 } a:hover{color: ;(鼠标经过时) text-decoration:underline;} 25-2.按钮式超链接 第7课 26.鼠标特效 a.help:hover{cursor:help;（）变换鼠标的形状}(帮助按钮的样式) 页面滚动条 27.项目列表 ul{list-style-type: none(不显示) (项目编号)/list-style-image:url(ixon1.jpg);用图片作为符号} <ul><li></li></ul>（不推荐使用） 无需表格的菜单 用ul li 第八课 27-2.横向菜单 #t{float:lef</p><p style='height:0px;padding:0;overflow:hidden'>21、t;(水平显示各个项目)} <div id=“t”> <ul><li></li><a href=""> </a></ul></div> 27-3.tab菜单第八课 28.CSS滤镜的使用(仅ＩＥ支持) ALPHA通道： .alpha{filter:alpha(opacity=50);} class="alpha" BLUR通道： .blur{filter:progid:DXTmageTransform.Microsoft.blur(pixelradius=4,makeshadow=false);} class="blur" 透明色： .chroma{filter:ch</p><p style='height:0px;padding:0;overflow:hidden'>22、roma(color= );(去掉颜色）} class=“chroma” Flip翻转： .flip1{filter:fliph;(水平翻转)/flipv(竖直翻转)/flipv fliph（水平，竖直同时翻转）} class="flip1" 遮罩： .mask={filter:mask(color= );} class="mask" 波浪： span.wave{filter:wave(add=0,ferq2,ligntstrength=70,phase=75,strength=4); } <span class="wave">波浪</span> 29.理解css与d</p><p style='height:0px;padding:0;overflow:hidden'>23、iv定位 div标记 ＜div＞</div＞在不同行上 ＜span＞</span＞在同一行上 29-1．盒子模型： border margin,padding float定位 float：left/right； position:absolute;绝对位置/related z-index: {position:absolute;脱离父子关系 z-index:1/o/-1(高低值也表明谁覆盖谁);} 给图片签名： 给文字设置决定定位及z-index 30.css排版（第11课） clear:both;(不收float的影响) 固定宽度且居中的版式： 方法一： </p><p style='height:0px;padding:0;overflow:hidden'>24、 body,html{margin:0px;padding:0px;text-align:center;background: ;} #container{position.relative;margin:0 auto;padding:0px;width:700px;text-align:left;background:url( .jpg)repeat-y;} 方法二： body,html{margin:0px;padding:0px;background: ;} #container{position.relative;left:50%； width:700px;margin-l</p><p style='height:0px;padding:0;overflow:hidden'>25、eft：-350;background:url( .jpg)repeat-y;} 31.框架搭建第12课 32.Javascript(13课) 表格输入时高亮：<script language=”javascript” type=”text/ javascript”> Function hilite(obj){obj=document.getElementById(“td”+obj.name.tostring());obj.style-border=’2px solid #007EFF’;//加粗，变色} Function delite(obj){obj=document.getEl</p><p style='height:0px;padding:0;overflow:hidden'>26、mentByLd(“td”+obj.name.tostring());obj.style.border=’1px solid #ABABAB’;//恢复原来的边框} </script> <script language=”javascript”> </ script>放在</head>前 页面之间的跳转 alert(a>b?”调用02.css ”“调用03.css”) 由远变近的文字：<script language=”javascript”> for(vari=0;i<128;i++){docement.write(‘<div style=”left”;+（200-i）+</p><p style='height:0px;padding:0;overflow:hidden'>27、’px;top’+(10+i/2)+‘px’>’)} </ script> 图片淡入淡出： 33.xml基础（可以用户自定义标签符号） 用于存储数据 Xml链接css文件:<?xml-stylesheet type=”text/css”href=”xxx.css”?> Xml文字阴影效果：加css文件<shadow></shadow> Xml古诗效果：加css文件<poem><title>静夜思</c><author>李白</author><verse>床前明月光<br/></verse></poem> 定义css：Br{display:block//让诗句分行显示} Aut</p><p style='height:0px;padding:0;overflow:hidden'>28、hor{} Verse{} Title{} Poem{} 35. CSS 轮廓 轮廓（outline）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。 CSS outline 属性规定元素轮廓的样式、颜色和宽度。 在元素周围画一条线 <style type="text/css"> p {border:red solid thin; outline:#00ff00 dotted thick; outline-color:#00ff00; outline-style: solid；outline-width:thin;（设置轮廓的颜色，样式，宽度）} <</p><p style='height:0px;padding:0;overflow:hidden'>29、/style> <p><b>注释：</b>只有在规定了 !DOCTYPE 时，Internet Explorer 8 （以及更高版本） 才支持 outline 属性。</p> </body> 36. CSS 框模型概述 CSS 框模型 (Box Model) 规定了元素框处理元素内容、内边距、边框 和 外边距 的方式。 #box { width: 70px; margin: 10px; padding: 5px; } CSS 边框属性 属性 描述 border 简写属性，用于把针对四个边的属性设置在一个声明。 border-style 用于设置</p><p style='height:0px;padding:0;overflow:hidden'>30、元素所有边框的样式，或者单独地为各边设置边框样式。 border-width 简写属性，用于为元素的所有边框设置宽度，或者单独地为各边边框设置宽度。 border-color 简写属性，设置元素的所有边框中可见部分的颜色，或为 4 个边分别设置颜色。 border-bottom 简写属性，用于把下边框的所有属性设置到一个声明中。 border-bottom-color 设置元素的下边框的颜色。 border-bottom-style 设置元素的下边框的样式。 border-bottom-width 设置元素的下边框的宽度。 border-left 简写属性，用于把左</p><p style='height:0px;padding:0;overflow:hidden'>31、边框的所有属性设置到一个声明中。 border-left-color 设置元素的左边框的颜色。 border-left-style 设置元素的左边框的样式。 border-left-width 设置元素的左边框的宽度。 border-right 简写属性，用于把右边框的所有属性设置到一个声明中。 border-right-color 设置元素的右边框的颜色。 border-right-style 设置元素的右边框的样式。 border-right-width 设置元素的右边框的宽度。 border-top 简写属性，用于把上边框的所有属性设置到一个声明中。 b</p><p style='height:0px;padding:0;overflow:hidden'>32、order-top-color 设置元素的上边框的颜色。 border-top-style 设置元素的上边框的样式。 border-top-width 设置元素的上边框的宽度。 CSS 外边距属性 属性 描述 margin 简写属性。在一个声明中设置所有外边距属性。 margin-bottom 设置元素的下外边距。 margin-left 设置元素的左外边距。 margin-right 设置元素的右外边距。 margin-top 设置元素的上外边距。 CSS 定位 (Positioning) position 属性值的含义： static 元素框正</p><p style='height:0px;padding:0;overflow:hidden'>33、常生成。块级元素生成一个矩形框，作为文档流的一部分，行内元素则会创建一个或多个行框，置于其父元素中。 relative 元素框偏移某个距离。元素仍保持其未定位前的形状，它原本所占的空间仍保留。 absolute 元素框从文档流完全删除，并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭，就好像元素原来不存在一样。元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。 fixed 元素框的表现类似于将 position 设置为 absolute，不过其包含块是视窗本身。 CSS 定位属性 CSS </p><p style='height:0px;padding:0;overflow:hidden'>34、定位属性允许你对元素进行定位。 属性 描述 position 把元素放置到一个静态的、相对的、绝对的、或固定的位置中。 top 定义了一个定位元素的上外边距边界与其包含块上边界之间的偏移。 right 定义了定位元素右外边距边界与其包含块右边界之间的偏移。 bottom 定义了定位元素下外边距边界与其包含块下边界之间的偏移。 left 定义了定位元素左外边距边界与其包含块左边界之间的偏移。 overflow 设置当元素的内容溢出其区域时发生的事情。 clip 设置元素的形状。元素被剪入这个形状之中，然后显示出来。 vertical-align 设置元素的垂直</p><p style='height:0px;padding:0;overflow:hidden'>35、对齐方式。 z-index 设置元素的堆叠顺序。 35.自适应的水平菜单，应用滑动门技术的玻璃效果菜单 <div id=”menu”><ul> <li><a href=” ”>home</b></a></li></ul> </div> #menu{字体，字号，宽度} #menu ul{ padding： 0 0 0 8PX；margin：0；list-style：none；height： ；background：；} #menu ul li{float：left；} #menu ul lia{display：block；line-height：35px; color: ;text-decroration:none;padding:0 0 0 4px;} #menu ul li a：hover{color: ;backgroud: ;} #menu ul li ab{display：block；} #menu ul li a：hover b{color: ;backgroud: no-repeat right top;} #menu ul li ab{display：block；padding：0 14px；0 0；} 36.div布局 </p> </div> </div> <span id="LabelScript"></span> <script src="https://m.zixin.com.cn/JS/bootstrap-collapse.js"></script> <div class="siteInner_bg" style="margin-top: 40px; border: solid 0px red; margin-left: 0px; margin-right: 0px;"> <div> <div style=" margin: auto; overflow:hidden; text-align: center;"> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?6e2a21bc68316db308b5fdc9a0d11f2e"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> </div> <div style=" height:80px; margin: auto; overflow:hidden; text-align: center;"> <a target="_blank" href='https://m.zixin.com.cn/ADMiddle.aspx?t=92ULKnFRa/o='> <img src="https://www.zixin.com.cn/FileUpload/Images/81dd1a0b-02e3-435a-aa37-fbfccae9a83d.gif" width="100%" height='80' alt="移动网页_全站_页脚广告1" /> </a> </div> </div> <div class="siteInner"> <p style="white-space: normal; text-align: center;"><a href="https://www.zixin.com.cn/h-33.html" target="_blank" title="关于我们" textvalue="关于我们"><span style="text-align: center;">关于我们</span></a> <span style="text-align: center;"> </span><a href="https://www.zixin.com.cn/h-37.html" target="_blank" title="便捷服务" textvalue="便捷服务">便捷服务</a> <span style="text-align: center;"> </span><a href="https://ai.zixin.com.cn/" target="_blank" title="自信AI" textvalue="自信AI">自信AI</a> <span style="text-align: center;"> </span><a href="https://gpt.zixin.com.cn/" target="_blank" title="AI导航" textvalue="AI导航">AI导航</a> <a href="https://www.zixin.com.cn/info/266.html" target="_blank" title="抽奖活动" textvalue="抽奖活动">抽奖活动</a></p><p style="white-space: normal; text-align: center;"><span style="color: rgb(153, 153, 153); font-family: 微软雅黑, 宋体, Arial; font-size: 12px; text-align: center; background-color: rgb(248, 248, 248);"></span><span style="text-align: center;">©2010-2025 宁波自信网络信息技术有限公司 </span><span style="text-align: center;"> </span><span style="text-align: center;">版权所有</span></p><p style="white-space: normal; text-align: center;"><span style="text-align: center;"><span style="text-align: center;"><span style="text-align: center;"><span style="text-align: center;">客服电话：4009-655-100 <span style="text-align: center;">投诉</span>/<span style="text-align: center;">维权</span>电话：18658249818</span></span></span></span></p><p style="white-space: normal; text-align: center;"><span style="text-align: center;"><img src="https://www.zixin.com.cn/FileUpload/ueditor_s/upload/2022-6/9/6379033271755225397249870.png" title="gongan.png" alt="gongan.png"/></span><a href="http://www.beian.gov.cn/portal/index.do" target="_blank" textvalue="浙公网安备33021202000488号">浙公网安备33021202000488号</a> </p><p style="white-space: normal; text-align: center;"><img src="https://www.zixin.com.cn/FileUpload/ueditor_s/upload/2022-7/4/6379256265460890686562879.png" title="icp.png" alt="icp.png"/><a href="http://beian.miit.gov.cn/" target="_blank" textvalue="浙ICP备2021020529号-1">浙ICP备2021020529号-1</a> <span style="text-align: center;"> | </span> <a href="https://dxzhgl.miit.gov.cn/dxxzsp/xkz/xkzgl/resource/qiyesearch.jsp?num=%E5%AE%81%E6%B3%A2%E8%87%AA%E4%BF%A1%E7%BD%91%E7%BB%9C%E4%BF%A1%E6%81%AF%E6%8A%80%E6%9C%AF%E6%9C%89%E9%99%90%E5%85%AC%E5%8F%B8&type=xuke" target="_blank" title="浙B2-20240490" textvalue="浙B2-20240490">浙B2-20240490</a><span style="text-align: center;"> </span></p><p style="white-space: normal; text-align: left;"><span style="text-align: center; font-family: 楷体, 楷体_GB2312, SimKai; font-size: 20px;">关注我们</span><span style="text-align: center;"> ：<a href="https://www.zixin.com.cn/news/113.html" target="_blank"><img src="https://www.zixin.com.cn/FileUpload/ueditor_s/upload/2022-7/9/6379298231429297878483475.png" title="微信公众号" alt="微信公众号"/></a></span><span style="text-align: center;"> <a href="https://www.zixin.com.cn/news/113.html" target="_blank"><img src="https://www.zixin.com.cn/FileUpload/ueditor_s/upload/2022-7/5/6379257739400583672497521.png" title="抖音" alt="抖音"/></a> <a href="https://weibo.com/zixinnetwork" target="_blank" style="color: rgb(217, 83, 79); text-align: center; white-space: normal;"><img src="https://www.zixin.com.cn/FileUpload/ueditor_s/upload/2022-7/5/6379257739400583672497523.png" title="微博" alt="微博"/></a> <a href="https://zixinnetwork.lofter.com/" target="_blank"><img src="https://www.zixin.com.cn/FileUpload/ueditor_s/upload/2022-7/5/6379257740834991205479163.png" title="LOFTER" alt="LOFTER"/></a> </span></p> </div> </div> <div style="position: fixed; bottom: 100px; right: 15px; z-index: 100000000000000000;"> <a href="https://work.weixin.qq.com/kfid/kfcb5dffb1386b26424"><img src="https://www.zixin.com.cn/FileUpload/Images/c1022425-c464-4203-b6dc-db237b2252d5.gif" style="width:36px" alt="客服"/></a> </div> <div class="trnav clearfix" id="navcontent" style="display: none; background-color:#3a71b1; "> <div class="trlogoside" id="navlogo" style="display: none;"> <a href="https://m.zixin.com.cn/" title="咨信网"><img src="https://www.zixin.com.cn/FileUpload/Images/c4280cd2-fe62-449e-aeca-027ef73439f5.png" alt="咨信网"></a> <div class="trnavclose" id="navclose"> <span></span> </div> </div> <div class="navcontainer"> <div class="row"> <ul class="nav navbar-nav trnavul headercontent" id="navigation" style="margin:20px 0 0px;"> <li><a target="_parent"href="https://m.zixin.com.cn/login.aspx">登录</a></li> <li><a target="_parent"href="https://m.zixin.com.cn/">首页 </a></li> <li><a target="_parent"href="https://m.zixin.com.cn/booklist-0.html">分类 </a></li> <li><a target="_parent"href="https://m.zixin.com.cn/infos.html">学堂 </a></li> <li><a target="_parent"href="https://m.zixin.com.cn/newslist.html">公告 </a></li> <li><a target="_parent"href="https://m.zixin.com.cn/h-0.html">帮助中心 </a></li> </ul> </div> </div> </div> <script type="text/javascript"> function stopPropagation(e) { var ev = e || window.event; if (ev.stopPropagation) { ev.stopPropagation(); } else if (window.event) { window.event.cancelBubble = true;//兼容IE } } $("#navmore").click(function (e) { $("#navcontent").show(); $("#navlogo").show(); stopPropagation(e); var navcontentwidth = $("#navcontent").width(); $('#navcontent').css({ 'right': '-' + navcontentwidth + 'px' }); $("#navcontent").show().animate({ "right": 0 }, 300); }); $(document).bind('click', function () { var navcontentwidth = $("#navcontent").width(); $("#navcontent").animate({ 'right': '-' + navcontentwidth + 'px' }, 300, function () { $("#navcontent").hide(); }); $("#navlogo").fadeOut(300); }); $("#navcontent").click(function (e) { stopPropagation(e); }); $("#navclose").click(function (e) { var navcontentwidth = $("#navcontent").width(); $("#navcontent").animate({ 'right': '-' + navcontentwidth + 'px' }, 300, function () { $("#navcontent").hide(); }); $("#navlogo").fadeOut(300); }); </script> <script> function BaseShare(title, desc, imgUrl) { var link = "https://m.zixin.com.cn/docdown/4859837.html"; if (wx) { wx.config({ debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。 appId: 'wx49d3b0cb6fb382c4', // 必填，公众号的唯一标识 timestamp: '1748777696', // 必填，生成签名的时间戳 nonceStr: '7F39F8317FBDB1988EF4C628EBA02591', // 必填，生成签名的随机串 signature: '5715388350628eb12ca64784c4945d7ff13796e5',// 必填，签名，见附录1 jsApiList: ['onMenuShareAppMessage', 'onMenuShareTimeline', 'updateAppMessageShareData', 'updateTimelineShareData', 'hideMenuItems'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2 //openTagList: ["wx-open-launch-weapp"]//H5打开小程序 }); wx.ready(function () { //需在用户可能点击分享按钮前就先调用 wx.hideMenuItems({// 要隐藏的菜单项，只能隐藏“传播类”和“保护类”按钮，所有menu项见附录3 menuList: ['menuItem:share:qq', 'menuItem:favorite', 'menuItem:share:QZone', 'menuItem:share:email', 'menuItem:originPage', 'menuItem:readMode', 'menuItem:delete', 'menuItem:editTag', 'menuItem:share:facebook', 'menuItem:share:weiboApp', 'menuItem:share:brand'] }); var shareData = { title: title, // 分享标题 desc: desc,//这里请特别注意是要去除html link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致 imgUrl: imgUrl, // 分享图标 }; wx.updateAppMessageShareData(shareData);//1.4 分享到朋友 wx.updateTimelineShareData(shareData);//1.4分享到朋友圈 }); } } function BaseShare(title, desc, imgUrl, link) { if (link=="") link = "https://m.zixin.com.cn/docdown/4859837.html"; if (wx) { wx.config({ debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。 appId: 'wx49d3b0cb6fb382c4', // 必填，公众号的唯一标识 timestamp: '1748777696', // 必填，生成签名的时间戳 nonceStr: '7F39F8317FBDB1988EF4C628EBA02591', // 必填，生成签名的随机串 signature: '5715388350628eb12ca64784c4945d7ff13796e5',// 必填，签名，见附录1 jsApiList: ['onMenuShareAppMessage', 'onMenuShareTimeline', 'updateAppMessageShareData', 'updateTimelineShareData', 'hideMenuItems'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2 //openTagList: ["wx-open-launch-weapp"]//H5打开小程序 }); wx.ready(function () { //需在用户可能点击分享按钮前就先调用 wx.hideMenuItems({// 要隐藏的菜单项，只能隐藏“传播类”和“保护类”按钮，所有menu项见附录3 menuList: ['menuItem:share:qq', 'menuItem:favorite', 'menuItem:share:QZone', 'menuItem:share:email', 'menuItem:originPage', 'menuItem:readMode', 'menuItem:delete', 'menuItem:editTag', 'menuItem:share:facebook', 'menuItem:share:weiboApp', 'menuItem:share:brand'] }); var shareData = { title: title, // 分享标题 desc: desc,//这里请特别注意是要去除html link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致 imgUrl: imgUrl, // 分享图标 }; wx.updateAppMessageShareData(shareData);//1.4 分享到朋友 wx.updateTimelineShareData(shareData);//1.4分享到朋友圈 }); } } </script> <!--footer--> <footer class="footer"> <a target="_parent" class="footer-item" href="https://m.zixin.com.cn/"> <img class="footer-item-img" src="/Master/img/tabbar/home.png" alt="首页" /> <div class="footer-item-txt ">首页</div> </a> <a target="_parent" class="footer-item" id="classify" href="https://m.zixin.com.cn/bookmap.html"> <img class="footer-item-img" src="/Master/img/tabbar/category.png" alt="分类" /> <div class="footer-item-txt ">分类</div> </a> <a target="_parent" class="footer-item" id="case" href="https://m.zixin.com.cn/zhuantilist-.html"> <img class="footer-item-img" src="/Master/img/tabbar/case.png" alt="专题" /> <div class="footer-item-txt ">专题</div> </a> <a target="_parent" class="footer-item" id="my" href="https://m.zixin.com.cn/UserDefault.aspx"> <img class="footer-item-img" src="/Master/img/tabbar/my.png" alt="我的" /> <div class="footer-item-txt ">我的</div> </a> </footer> <script> $(document).ready(function () { var arr = $(".headercontent"); for (var i = 0; i < arr.length; i++) { (function (index) { var url = "https://m.zixin.com.cn/header.aspx"; $.get(url + "?tp=0&t=" + (new Date()).valueOf(), function (d) { try { arr.eq(index).empty().html(d); } catch (e) { } try { arr.html(d); } catch (e) { } }); })(i); } }); </script> <script src="https://m.zixin.com.cn/js/jquery.lazyload.js"></script> <script charset="utf-8"> $("img.lazys").lazyload({ threshold: 200, effect: "fadeIn" }); </script> </body> </html>