我与不得不说的事儿 -欧洲杯足彩官网

有人擅长木匠活，有人擅长织毛衣。有人习惯避开90年代留下的html规则，可偏偏我就不是这种人。本文就来讲一个我和input之间的故事：是如何变成了一个混蛋的，以及它必死的原因。

早年历史
1995年是值得大书特书的一年。《老友记》，《急诊室的故事》，《希娜》火了起来。tlc凭借一首《waterfalls》跃居榜首。浏览器是好的，因为html很好。那时候有mosaic,网景（netscape）,和ie1，html2规范正在标准化。1995年也正是input标签诞生的一年，现在它已经这么老了！都可以为它的年龄干一杯了，现在的确值得来好好谈一谈。

input诞生时有八种类型：text, password, checkbox, radio, image, hidden, submit 和 reset，随后的一个rfc添加了file类型。

等等，你说……image？好吧，我们来谈谈这个。

看起来像一个图片，但是实际上是一个图片按钮，点击时会提交（x，y）坐标，表示你点击的图片的位置。如果不指定src，按钮会显示“submit”。如果使用的是火狐，会显示”submit query”，如果使用ie，什么都不会显示。

另外，type=input在默认情况下只是一个空文本框，在chrome，safari和火狐浏览器中的指示信息分别是”no file chosen”、 “no file selected”和”no file selected”。

黑马</strong> <br />我一直认为，input和textarea是不同时期的产物，这样可以解释他们为何如此大相径庭。这种说法从某种意义上也讲得通，input是从1993年在mosaic上开始出现的，是inside改进的版本。他们都是html2的产物。html2标准规定，input是一个自关闭的标签，拥有一个value属性，而textarea则需要关闭，有自己的内容数据。他们的作用都是呈现可供编辑的文本框： <br /><pre name="code" class="html"> <input value="batman"> <textarea rows="1">batman
update：有网友指出，支持多行，但是换行符不能在value属性中表示，所以它就采用了需要关闭的标签，中间包裹内容数据的方式。这就说的通了。 <br /> <br /><strong>1995-2011，缓慢发展的几年</strong> <br />1999年，html4只添加了type="button".我最喜欢的特性是，在没有自定义style的时候，将 <input type="button"> 和 <input type="button" value="submit">写在同一行，在chrome/safari/edge浏览器中看起来不是垂直排列的： <br /><div style="text-align: center;"><img src="http://dl2.iteye.com/upload/attachment/0112/6874/225c9f58-cc1f-3bab-aa5a-8606bac6f515.png" /></div> <br /><strong>然后一切都开始变糟了……</strong> <br />后来，2011年html5的input添加了大量的类型。但是现在已经2015年了，大部分都还没实现。这份“太长不看”的特性列表简单来说，有下面几点：type=color之只适用于firefox/chrome，date/time的input只能在chrome/edge/ios上正常工作，还有，所有chrome支持的特性opera都支持。这里有一个所有input的demo。 <br /> <br />下面我们来说点有意思的。 <br /> <br /><input type="search">对于padding，border还有20世纪那该死的圆边风格的边框有些随意，在各个浏览器中的显示效果完全是不可控制的： <br /><div style="text-align: center;"> <br /><img src="http://dl2.iteye.com/upload/attachment/0112/6934/9c195633-0d53-3c1a-bd7f-8ab9e2a97cf6.png" /> <br /></div> <br />如果你幸运地使用了一个支持type="date"的浏览器，不用担心输入日期的样式——::webkit预设了八种选择器，但是只可以用于input输入框的样式，而不能用于下拉菜单。毕竟，css对你的身体不好。 <br /> <br /><strong>当你觉得不能更糟的时候，javascript来了</strong> <br />我了解所有css的古怪地方。我用chrome工作了两年，现在就靠着blink团队旁工作，我知道我们所写的各种渲染器都存在着各种各样的bug。然而，<input>的api并不古怪——它只是一罐子蜘蛛，当你打开罐子的那一瞬间，一切都太迟了。你被蜘蛛淹没了，就连你的猫都成了蜘蛛。最好放把火吧。 <br /> <br />从1995年开始，input的radio类型和checkbox类型有了额外的属性checked，来判定是否选择的状态。这也意味着，所有别的input类型也有了这种属性，htmlinputelement可以包含htmlinputelement，然后这一个里面又可以包含htmlinputelement。所以下面这段代码可以工作，即使毫无意义。 <br /><pre name="code" class="html"> var textinput = document.queryselector('input[type="text"]'); console.log(textinput.checked); // prints false. textinput.checked = true; console.log(textinput.checked); // prints true. // 没有打开潘多拉. </pre> <br />酷。 <br /> <br />input里也有文本，文本可以被选择。所以htmlinputelement原型可以定义两种属性selectionstart和selectionend，定义选择区域： <br /><pre name="code" class="java">document.queryselector(‘input’).selectionstart = 2;</pre> <br />这段代码会事先在文本区域选择两个字符。但是只对text,url和password有用，对于别的类型，会抛出一个异常： <br /><pre name="code" class="html"> uncaught domexception: failed to read the 'selectionstart' property from 'htmlinputelement': the input element's type ('number') does not support selection. </pre> <br />即使文本可以被选择： <br /><div style="text-align: center;"> <br /><img src="http://dl2.iteye.com/upload/attachment/0112/6956/58a0f05f-2c23-3f0b-ab94-2373ff2061b1.png" /> <br /></div> <br />所以这些无关紧要的特性在某些情况下能正常工作，有时候就不能。很好地破坏了api的一致性。 <br /> <br />事情还要复杂的多。重点是，都过去<a target="_blank" href="http://www.martinrinehart.com/frontend-engineering/engineers/html/html-tag-history.html">21年了</a>，浏览器在input上都没有统一，在“如何表示用户没有选择文件”上都没有达成共识。 <br /> <br />现在来想象一下，将来所有的web组件都提供了原生支持，出现了一种新的标准<better-input>，真正包含dom元素，而不再是div的大锅粥。想象一下<better-input>在所有浏览器的样式都统一，在任何地方看起来都一样。好好做个美梦吧~ ✨ <br /> <br />原文链接：<input> <a target="_blank" href="http://meowni.ca/posts/a-story-about-input/">i ♡ you, but you’re bringing me down </a> <br />编译：赖信涛，关注python，喜欢编程和电子游戏。个人博客：<a target="_blank" href="http://www.kawabangga.com/">http://www.kawabangga.com/</a> </div> <div id="news_recommended_n2"> <ins data-revive-zoneid="163" data-revive-id="8c38e720de1c90a6f6ff52f3f89c4d57"></ins> </div> <div class="attachments"> <ul style="display:none;"> <li><a href="http://dl2.iteye.com/upload/attachment/0112/6866/96d8f91e-3b0b-3dee-90b5-25ec61cd67ea.png" target="_blank"><img src='http://dl2.iteye.com/upload/attachment/0112/6866/96d8f91e-3b0b-3dee-90b5-25ec61cd67ea-thumb.png' class='magplus' title='点击查看原始大小图片' /></a></li> <li>大小: 76.8 kb</li> </ul> <ul style="display:none;"> <li><a href="http://dl2.iteye.com/upload/attachment/0112/6874/225c9f58-cc1f-3bab-aa5a-8606bac6f515.png" target="_blank"><img src='http://dl2.iteye.com/upload/attachment/0112/6874/225c9f58-cc1f-3bab-aa5a-8606bac6f515-thumb.png' class='magplus' title='点击查看原始大小图片' /></a></li> <li>大小: 6.3 kb</li> </ul> <ul style="display:none;"> <li><a href="http://dl2.iteye.com/upload/attachment/0112/6934/9c195633-0d53-3c1a-bd7f-8ab9e2a97cf6.png" target="_blank"><img src='http://dl2.iteye.com/upload/attachment/0112/6934/9c195633-0d53-3c1a-bd7f-8ab9e2a97cf6-thumb.png' class='magplus' title='点击查看原始大小图片' /></a></li> <li>大小: 20.2 kb</li> </ul> <ul style="display:none;"> <li><a href="http://dl2.iteye.com/upload/attachment/0112/6956/58a0f05f-2c23-3f0b-ab94-2373ff2061b1.png" target="_blank"><img src='http://dl2.iteye.com/upload/attachment/0112/6956/58a0f05f-2c23-3f0b-ab94-2373ff2061b1-thumb.png' class='magplus' title='点击查看原始大小图片' /></a></li> <li>大小: 9.1 kb</li> </ul> <ul> <li><a href="#" onclick="$$('div.attachments ul').invoke('show');$(this).up(1).hide();return false;">查看图片附件</a></li> </ul> </div> <div> 来自: <a href="http://geek.csdn.net/news/detail/42158">极客头条</a> </div> </div> <div id="digg_bottom" class="clearfix"> <div class="share_weibo">分享到： <a data-type='sina' href="javascript:;" title="分享到新浪微博"><img src="/images/sina.jpg"></a> <a data-type='qq' href="javascript:;" title="分享到腾讯微博"><img src="/images/tec.jpg"></a> </div> <div class='digged'><strong>4</strong> <br/>顶</div><div class='digged'><strong>0</strong> <br/>踩</div></div> <div class="comments"> <span style="font-weight:bold; font-size:16px;margin-right:14px;">评论</span> 共 3 条 请<a href="/login">登录</a>后发表评论 <a id="comments" name="comments"></a> <div id='nc139218'> <h5>3 楼 <a href='https://www.iteye.com/blog/user/oaklet' target='_blank' title='oaklet'>oaklet</a> 2015-10-30 14:06 </h5> <div>神翻译，牛</div> </div> <div id='nc139216'> <h5>2 楼 <a href='https://www.iteye.com/blog/user/yunzhongxia' target='_blank' title='yunzhongxia'>yunzhongxia</a> 2015-10-30 09:25 </h5> <div>翻译的真别扭</div> </div> <div id='nc139212'> <h5>1 楼 <a href='https://www.iteye.com/blog/user/yebn' target='_blank' title='yebn'>yebn</a> 2015-10-29 20:49 </h5> <div><img src="/images/smiles/icon_cool.gif" /> <img src="/images/smiles/icon_twisted.gif" /> <img src="/images/smiles/icon_rolleyes.gif" /> <img src="/images/smiles/icon_wink.gif" /> <img src="/images/smiles/icon_rolleyes.gif" /> <img src="/images/smiles/icon_surprised.gif" /> </div> </div> </div> <div class="comments"><h3>发表评论</h3></div> <p style="text-align:center; margin-top:10px; margin-bottom:30px;"><a href="/login"> <img src="/images/login_icon.png" style="vertical-align:middle; margin-right: 10px;" /> 您还没有登录,请您登录后再发表评论 </a></p> </div> <div class="comments"> <div class="boutique-curr clearfix" id="album_detail_wrap"> <h3>相关推荐</h3> <ul style="margin-top: 8px" class="clearfix"> <div class="mod_topic_wrap" style="float: left"> <div class="post_feed_box" style="width:660px"> <div id="post_feed_wrap" class="post_feed_wrap post_feed_style1"> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/weixin_39541681/article/details/115080788" target="_blank" title="java 跨域 下载文件_node实现文件下载不得不说的那些事儿">java 跨域 下载文件_node实现文件下载不得不说的那些事儿</a> <p>这几天一直在做远程文件下载的事，现在总算有了解决，特来记录一下踩过的坑和想揍自己的心需求应用场景是这样的，底层逻辑数据请求接口是由java写的，也就是说原始文件存在java服务端,返回时有加密措施由于工作需要...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/it__ls/article/details/125526587" target="_blank" title="java8操作">java8操作</a> <p> } //predicate传递判断的方法 public static list filterapples(list inventory, predicate p){ list result = new arraylist<>(); for(apple apple : inventory){ //test测试 if(p.test(apple)){ result.add(apple...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/fly_hps/article/details/88628374" target="_blank" title="【技术分享】关于python漏洞挖掘那些不得不提的事儿">【技术分享】关于python漏洞挖掘那些不得不提的事儿</a> <p>前言 python因其在开发更大、更复杂应用程序方面独特的...这篇文章的主要受众是还不太熟悉python的人，其中会提及少量与安全有关的行为以及有经验开发人员遵循的规则。 输入函数 在python2强大的内置函数中，输入...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/weixin_39757265/article/details/111796167" target="_blank" title="防火墙阻止tftp_防火墙管理那些不得不知道的事儿！">防火墙阻止tftp_防火墙管理那些不得不知道的事儿！</a> <p> [y/n]:y please input the file name(*.cfg)[cfa0:/startup.cfg] (to leave the existing filename unchanged, press the enter key): //enter cfa0:/startup.cfg exists, overwrite? [y/n]:y validating file. ...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/yishui50/article/details/12789531" target="_blank" title="html最给力的入门教程">html最给力的入门教程</a> <p>第一章 html概述与基本结构  一、html的概述     html的英语意思是：hypertextmarked language，即超文本标</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/weixin_33981932/article/details/90392948" target="_blank" title="关于python漏洞挖掘那些不得不提的事儿">关于python漏洞挖掘那些不得不提的事儿</a> <p>前言 python因其在开发更大、更复杂应用程序方面独特的便捷性，使得它在计算机环境中变...这篇文章的主要受众是还不太熟悉python的人，其中会提及少量与安全有关的行为以及有经验开发人员遵循的规则。 输入函数 在p...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/weixin_39517199/article/details/116994061" target="_blank" title="c语言枚举类型有什么作用,关于c语言枚举类型不得不说的故事">c语言枚举类型有什么作用,关于c语言枚举类型不得不说的故事</a> <p>经济学家说过，路边是不会有100元的，但是如果有，你还是要捡起来。本文引用地址：http://www.eepw.com.cn/article/202005/413512.htm同理，在貌似万物免费的网络时代，你是很难找到有针对性的好资料的，但是如果有...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/weixin_33991727/article/details/94316734" target="_blank" title="scau 9501 acmer不得不知道的事儿">scau 9501 acmer不得不知道的事儿</a> <p>9501 acmer不得不知道的事儿 时间限制:1000ms 内存限制:65535k 提交次数:0 通过次数:0 题型: 编程题 语言: 无限制 description 作为一个入门的acmer，在参加比赛之前，你势必要了解比赛的一些基本规则，例如一...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/weixin_33737134/article/details/94316737" target="_blank" title="scau 10675 acmer不得不知道的事儿(二)">scau 10675 acmer不得不知道的事儿(二)</a> <p>10675 acmer不得不知道的事儿(二) 时间限制:1000ms 内存限制:65535k 提交次数:0 通过次数:0 题型: 编程题 语言: 无限制 description 作为一个入门的acmer，在参加比赛之前，你势必要了解算法的一些基本概念，...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/insistlzh/article/details/79713158" target="_blank" title="关于 vue.js 的那些事儿">关于 vue.js 的那些事儿</a> <p>15年开始，在各大论坛技中，与 vue.js 这一相关词语的内容爆炸式增长，在前端技术增速中独领风骚，迅速成为前端三巨头之一。记得在某个社区中有人这样介绍三巨头“来自 google 的 angular，来自 facebook 的 react，...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/weixin_34220834/article/details/86053978" target="_blank" title=".net中那些所谓的新语法之三：系统预定义委托与lambda表达式">.net中那些所谓的新语法之三：系统预定义委托与lambda表达式</a> <p>开篇：在上一篇中，我们了解了匿名类、匿名方法与扩展方法等所谓的新语法，这一篇我们继续征程，看看系统预定义委托（action/func/predicate）和超爱的lambda表达式。为了方便码农们，.net基类库针对实际开发中最...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/insistlzh/article/details/86504738" target="_blank" title="【vue教程】01：入门前的概述：关于vue那些事儿">【vue教程】01：入门前的概述：关于vue那些事儿</a> <p>从去年开始，在各大论坛技中，与 vue.js 这一相关词语的内容爆炸式增长，在前端技术增速中独领风骚，迅速成为前端三巨头之一。记得在某个社区中有人这样介绍三巨头“来自 google 的 angular，来自 facebook 的 react...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/analyzesystem/article/details/51577060" target="_blank" title="android开发之sensors与摇一摇">android开发之sensors与摇一摇</a> <p>list<sensor> devicesensors = msensormanager.getsensorlist(sensor.type_all); //....................处女分割线......................... private sensormanager msensormanager; ... msensormanager = ...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/nbalichaoq/article/details/39342897" target="_blank" title="闲聊linux中的input设备">闲聊linux中的input设备</a> <p>至于这三者之间的区别，我就不在这啰嗦了，google一下一大堆。我要强调的是，无论上面三个设备中的任何一种设备，要想在linux实现它的设备驱动，首先要对它进行一系列的初始化工作，然后需给它提供一个设备操作集合...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/sadamoo/article/details/7993344" target="_blank" title="闲聊linux中的input设备(转)">闲聊linux中的input设备(转)</a> <p>至于这三者之间的区别，我就不在这啰嗦了，google一下一大堆。我要强调的是，无论上面三个设备中的任何一种设备，要想在linux实现它的设备驱动，首先要对它进行一系列的初始化工作，然后需给它提供一个设备操作集合...</p> </li> <li class="news-recommends-ajax"> <a href="https://blog.csdn.net/weixin_33849215/article/details/94316791" target="_blank" title="scau 10685 acmer不得不知道的事儿（一）-----续">scau 10685 acmer不得不知道的事儿（一）-----续</a> <p>10685acmer不得不知道的事儿（一）-----续 时间限制:1000ms 内存限制:65535k提交次数:0 通过次数:0 题型: 编程题语言: 无限制 description 如果你完成了10年那题acmer不得不知道的事儿，请直接跳到描述的...</p> </li> <li class="news-recommends-ajax"> <a href="https://download.csdn.net/download/calculusstill/88964058" target="_blank" title="pandas_market_calendars-0.3-py3-none-any.whl">pandas_market_calendars-0.3-py3-none-any.whl</a> <p>python库是一组预先编写的代码模块，旨在帮助开发者实现特定的编程任务，无需从零开始编写代码。这些库可以包括各种功能，如数学运算、文件操作、数据分析和网络编程等。python社区提供了大量的第三方库，如numpy、pandas和requests，极大地丰富了python的应用领域，从数据科学到web开发。python库的丰富性是python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径，而且为经验丰富的开发者提供了强大的工具，以高效率、高质量地完成复杂任务。例如，matplotlib和seaborn库在数据可视化领域内非常受欢迎，它们提供了广泛的工具和技术，可以创建高度定制化的图表和图形，帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。 </p> </li> <li class="news-recommends-ajax"> <a href="https://download.csdn.net/download/zz_ll9023/88965994" target="_blank" title="stm32单片机fpga毕设电路原理论文报告基于ide硬盘的数字图像存储技术研究">stm32单片机fpga毕设电路原理论文报告基于ide硬盘的数字图像存储技术研究</a> <p>stm32单片机fpga毕设电路原理论文报告基于ide硬盘的数字图像存储技术研究本资源系百度网盘分享地址</p> </li> <li class="news-recommends-ajax"> <a href="https://download.csdn.net/download/weixin_43894266/88965978" target="_blank" title="rust 程序设计语言(基于 rust 1.67.1)">rust 程序设计语言(基于 rust 1.67.1)</a> <p>适合rust入门。深入浅出，事无巨细，远胜市面上所有入门书。而且是免费的</p> </li> </div> </div> </div> </ul> </div> </div> </div> <script type="text/javascript"> function quote_comment(id) { new ajax.request('/editor/quote', { parameters: {'id':id, 'type':'newscomment'}, onsuccess:function(response){ editor.bbcode_editor.textarea.insertafterselection(response.responsetext); element.scrollto(editor.bbcode_editor.textarea.element);} }); } dp.syntaxhighlighter.highlightall('code', true, true); fix_image_size($$('div#news_content img'), 650); fix_image_size($$('div.comments img'), 620); new weiboshare({share_buttons: $$('.share_weibo')[0], img_scope: $('news_content')}); </script> </div> <div id="local"> <div class="news-right-side"> </div> <script> jquery(function(){ window.csdn.recommendside({ contentbox: "recommend", postbox: jquery(".news-right-side"), query:'我与<input>不得不说的事儿', popu:'725' }) }) </script> <div class="persion_article"> </div> </div> <div id="nav"> <div class="wrapper"> <ul> <li><a href="https://www.iteye.com/">iteye凯发推荐首页</a></li> <li><a href="https://www.iteye.com/news" class='selected'>资讯</a></li> <li><a href="https://www.iteye.com/magazines">精华</a></li> <li><a href="https://www.iteye.com/forums">论坛</a></li> <li><a href="https://www.iteye.com/ask">问答</a></li> <li><a href="https://www.iteye.com/blogs">博客</a></li> <li><a href="https://www.iteye.com/blogs/subjects">专栏</a></li> <li><a href="https://www.iteye.com/groups">群组</a></li> <li><a href="https://www.iteye.com/resources" >下载</a></li> <li class="last"><a href="https://www.iteye.com/codesources">资源</a></li> <div class="login-fr"> <li style="width: 250px;padding: 0 15px!important;margin-right: 9px;"> <div class="toolbar-search-container"> <input id="csdn_so_search_text" autocomplete="off" type="text" value="" placeholder="java"> <button onclick="csdn_so_search()"> <i></i><span>搜索</span> </button> </div> </li> <a href="/login" class="welcome" title="登录"> 您还未登录! </a>| <a href="/login">登录</a> </div> </ul> </div> </div> <script> // 效果广告平台 图片延迟统计 --start if (window.csdn === undefined) { window.csdn = {}; } if(!csdn.trackad) { var s = document.createelement('script'); s.type = 'text/javascript'; s.async = true; s.src = 'https://g.csdnimg.cn/asdf/1.0.7/trackad.js'; var x = document.getelementsbytagname('script')[0]; x.parentnode.insertbefore(s, x); } </script> <style> .toolbar-search-container { width: 100%; height: 23px; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 0; margin-top: 2px; } .toolbar-search-container input { font-size: 13px; display: inline-block; width: calc(100% - 58px); height: 100%; line-height: inherit; border: 0 none; outline: 0; background: #f5f6f7; color: #222226; vertical-align: top; text-indent: 16px; border: 1px solid #e8e8ed; border-right: none; -webkit-box-sizing: border-box; box-sizing: border-box; border-radius: 16px 0 0 16px; /* padding: 0px!important; */ } .toolbar-search-container input:focus { border: 1px solid #fc5531; border-right: none } .toolbar-search-container button { display: inline-block; width: 56px; height: 100%; outline: 0; border: 0 none; border-radius: 0 16px 16px 0; font-size: 13px; font-weigth: 700; line-height: 32px; cursor: pointer; -webkit-transition: all .2s ease-in; transition: all .2s ease-in; background-color: #81d3f8; text-align: left; padding: 0px!important } .toolbar-search-container button:hover { background-color: #3671a5 } .toolbar-search-container button i { display: inline-block; width: 24px; height: 24px; background: url(/uploads/image/gccimages/csdn-white-search.png) no-repeat center center; background-size: 100%; vertical-align: middle; vertical-align: -3px; } .toolbar-search-container button span { display: inline-block; vertical-align: top; color: white; margin-top: -3px; } .login-fr{ float: right; text-align: right; line-height: 27px; color:#fff; overflow: hidden; } .login-fr a.welcome_user_page { display: inline-block!important; /* padding: 7px!important; padding-top: 7px!important; */ line-height: 1; max-width: 110px!important; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; vertical-align: bottom; } .login-fr a{ display: inline!important; padding-left: 2px!important; padding-right: 2px!important; margin:0 2px!important; } div#nav li { padding: 0 0px!important; } </style> <script> function csdn_so_search() { let q = document.getelementbyid('csdn_so_search_text').value.trim(); if (!q) { q = "java" } window.open('https://so.csdn.net/so/search?from=pc_iteye&q=' encodeuricomponent(q)) } </script> </div> <div id="footer"> <div id="site_nav"> <ul> <li><a href="/index/service">广告服务</a></li> <li><a href="https://webmaster.iteye.com">iteye黑板报</a></li> <li><a href="/index/contactus">联系欧洲杯足彩官网</a></li> <li class="last"><a href="/index/friend_links">欧洲杯足彩官网的友情链接</a></li> </ul> </div> <div id="欧洲杯足彩官网 copyright"> © 2003-2024 iteye.com. [ <a href="https://beian.miit.gov.cn/">京icp备19004658号-7</a> <a href="http://www.beian.gov.cn/portal/registersysteminfo?recordcode=11010502030278">京公网安备11010502030278</a> ]<br/> 北京创新乐知网络技术有限公司 欧洲杯足彩官网的版权所有<br /> </div> </div> </div> <script type="text/javascript"> // document.write("<img src='https://stat.iteye.com/?url=" encodeuricomponent(document.location.href) "&referrer=" encodeuricomponent(document.referrer) "&user_id=' width='0' height='0' />"); </script> global site tag (gtag.js) - google analytics <script async src="https://www.googletagmanager.com/gtag/js?id=ua-127895514-6"></script> <script> window.datalayer = window.datalayer || []; function gtag(){datalayer.push(arguments);} gtag('js', new date()); gtag('config', 'ua-127895514-6'); </script> <script> settimeout(function($){ window.csdn.fixedsidebar({ targetbox: $('.persion_article'), //判断到达底部的div,公共footer可选 $('.persion_article'),$('.public_pc_right_footer2018') mainbox: $("#main"), //侧边栏旁边的主体div,默认 $("main") sidebar: $("#local"), //侧边栏,默认 $("aside") direction: 'right', //侧边栏浮动方向,可选'right','left', position: 'fixed',//定位方式 bottom: 0, zindex: 99, sidebarrightmargin: 8,//direction为left,侧边栏距离mainbox的右边距 sidebarleftmargin: 8,//direction为right,侧边栏距离mainbox的左边距 }) },0,jquery) </script> <script type="text/javascript"> function json_digg(id) { call_json_digg('digg', id) }; function json_bury(id) { call_json_digg('bury', id) }; function disable_digg_link(id) { $$('#digg_link_' id ' a.push_up').each(function(link) { old_count = $('digg_count_' id).textcontent; link.replace('<span class="push_up">顶 <b id="digg_count_' id '">' old_count '</b></span>') }); $$('#digg_link_' id ' a.trample').each(function(link) { old_count = $('bury_count_' id).textcontent; link.replace('<span class="trample">踩 <b id="bury_count_' id '">' old_count '</b></span>') }); }; function call_json_digg(type, id) { if (type === 'bury' || type === 'digg') { new ajax.request('/news/' type, { method:'post', parameters: {"id": id, "format" : 'json' }, onsuccess: function(transport) { disable_digg_link(id); var json = transport.responsetext.evaljson(); $(type "_count_" id).update(json[type '_count']); } }); } }; </script> <script src="//g.csdnimg.cn/common/csdn-report/report.js" type="text/javascript"></script> <style> .userinfo {display: none !important;} .persion_article h3{ background: none !important; border-bottom: none!important; padding: 0!important; margin-bottom: 0!important; line-height: 1!important; } .persion_article .right_box{ margin-top: 0!important; } .persion_article .footer_box .feed_new_tit span{ padding-left: 0!important; } </style> <script> (function($){ var windowheight = $(window).height(), contentheight = $(".hide-main-content").height() windowheight = windowheight * 1.2 //获得可视区域高度 if(contentheight > windowheight){ $(".hide-article-box").show() $(".hide-main-content").css({'height': windowheight,'overflow':'hidden'}) $(".hide-article-box").find("#btn-readmore").click(function(){ $(this).parents('.hide-main-content').removeattr('style') $(this).parent().hide() }) } })(jquery) </script> <script type="text/javascript">var $csdn_iteye_jq = jquery.noconflict();// 解决jq与prototype.js命名空间冲突的问题</script> </body> </html>