div title样式_CSS背景样式

div title样式_CSS背景样式_第1张图片

    背景样式包括两个方面:一个是“背景颜色”,另外一个是“背景图片”。

    CSS中,定义“背景颜色”使用的是background-color属性,而定义“背景图片”往往涉及以下列表属性。

属性 说明
background-image 背景图片地址
background-repeat 背景图片横向、纵向重复
background-position 背景图片位置
background-attachment 背景图片固定

下面我们一起看看这些属性

background-color

    颜色值有两种,一种是“关键字”,另外一种是“十六进制RGB值”。    

    注意:color属性用于定义“文本颜色”,而background-color属性用于定义“背景颜色”。 

background-image

     在给元素的背景设置图片时候,需要为容器设置宽高。并且宽高要与背景图片宽高相同。否则就是下面例子 

DOCTYPE html>

    

        

        背景图片title></p> <p>        <style type="text/css"></p> <p>            div{ </p> <p>                width: 200px;</p> <p>                height: 200px;</p> <p>                background-image: url("E:/安妮海瑟薇.jpg");</p> <p>            }</p> <p>        style></p> <p>    head></p> <p>    <body></p> <p>        <div>div></p> <p>    body></p> <p>html></p> <p><a href="http://img.e-com-net.com/image/info8/013b9a79a6bb4dddb864817672d9cda5.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/013b9a79a6bb4dddb864817672d9cda5.jpg" alt="div title样式_CSS背景样式_第2张图片" width="650" height="384" style="border:1px solid black;"></a></p> <p>这就导致了背景图片不能完全显示。</p> <p>    背景图片与图片是不一样的,背景图片是使用CSS来实现,而图片是使用HTML来实现。 </p> <p><strong>background-repeat</strong></p> <p>    使用background-repeat属性来定义背景图片的重复方式。</p> <p>    background-repeat属性取值有4个,如下表</p> <table> <tbody> <tr> <td align="center"><strong>属性值</strong></td> <td align="center"><strong>说明</strong></td> </tr> <tr> <td align="left">repeat</td> <td align="left">在水平方向和垂直方向上同时平铺</td> </tr> <tr> <td align="left">repeat-x</td> <td align="left">只在水平方向平铺</td> </tr> <tr> <td align="left">repeat-y</td> <td align="left">只在垂直方向平铺</td> </tr> <tr> <td align="left">no-repeat</td> <td align="left">不平铺</td> </tr> </tbody> </table> <p>下面看一个例子</p> <p>DOCTYPE html></p> <p><html></p> <p>    <head></p> <p>        <meta charset="UTF-8" /></p> <p>        <title>背景图片重复title></p> <p>        <style type="text/css"></p> <p>            div{ </p> <p>                width: 100px;</p> <p>                height: 100px;</p> <p>                border: 1px solid silver;</p> <p>                background-image: url("E:/king.png");</p> <p>            }</p> <p>            .div1{ background-repeat: repeat;}</p> <p>            .div2{ background-repeat: repeat-x;}</p> <p>            .div3{ background-repeat: repeat-y;}</p> <p>            .div4{ background-repeat: no-repeat;}</p> <p>        style></p> <p>    head></p> <p>    <body></p> <p>        <div class="div1">div></p> <p>        <div class="div2">div></p> <p>        <div class="div3">div></p> <p>        <div class="div4">div></p> <p>    body></p> <p>html></p> <p><a href="http://img.e-com-net.com/image/info8/eb308c70052046bda31f18e312ae4cc0.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/eb308c70052046bda31f18e312ae4cc0.jpg" alt="div title样式_CSS背景样式_第3张图片" width="650" height="606" style="border:1px solid black;"></a></p> <p>    注意:元素的宽度和高度必须大于背景图片的宽度和高度,这样才会有重复效果。  </p> <p><strong>background-position</strong></p> <p>    使用background-position属性来定义背景图片的位置。</p> <p>    background-position属性常用取值有两种:一种是“像素值”,另外一种是“关键字”。</p>像素值 <p>    当取像素值时候,要同时设置水平方向和垂直方向的数值。  </p> <p>    例如“background-position:12px 24px;”表示背景图片距离该元素左上角的水平方向距离为12px,垂直方向距离为24px。</p> <p>DOCTYPE html></p> <p><html></p> <p>    <head></p> <p>        <meta charset="UTF-8" /></p> <p>        <title>背景图片位置title></p> <p>        <style type="text/css"></p> <p>            div{ </p> <p>                width: 300px;</p> <p>                height: 200px;</p> <p>                border: 1px solid silver;</p> <p>                background-image: url("E:/lion.png");</p> <p>                background-repeat: no-repeat;</p> <p>               <strong> background-position: 20px 20px;</strong></p> <p>            }</p> <p>        style></p> <p>    head></p> <p>    <body></p> <p>        <div>div></p> <p>    body></p> <p>html></p> <p><a href="http://img.e-com-net.com/image/info8/b470c67fab454213a1ec5260c6d157d6.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/b470c67fab454213a1ec5260c6d157d6.jpg" alt="div title样式_CSS背景样式_第4张图片" width="650" height="426" style="border:1px solid black;"></a></p> <p>background-position属性设置的两个值是相对该元素的左上角来的。</p> 关键字 <p>    background-position属性的关键字取值如下表</p> <table> <tbody> <tr> <td align="center"><strong>属性值</strong></td> <td align="center"><strong>说明</strong></td> </tr> <tr> <td align="left">top left</td> <td align="left">左上</td> </tr> <tr> <td align="left">top center</td> <td align="left">靠上居中</td> </tr> <tr> <td align="left">top right</td> <td align="left">右上</td> </tr> <tr> <td align="left">left center</td> <td align="left">靠左居中</td> </tr> <tr> <td align="left">center center</td> <td align="left">正中</td> </tr> <tr> <td align="left">right center</td> <td align="left">靠右居中</td> </tr> <tr> <td align="left">bottom left</td> <td align="left">左下</td> </tr> <tr> <td align="left">bottom center</td> <td align="left">靠下居中</td> </tr> <tr> <td align="left">bottom right</td> <td align="left">右下</td> </tr> </tbody> </table> <p>这些关键字效果如下图</p> <p><a href="http://img.e-com-net.com/image/info8/b60fcbe9a6724fc0bf7da115b95e4841.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/b60fcbe9a6724fc0bf7da115b95e4841.jpg" alt="div title样式_CSS背景样式_第5张图片" width="472" height="251" style="border:1px solid black;"></a></p> <p>实例如下 </p> <p>DOCTYPE html></p> <p><html></p> <p>    <head></p> <p>        <meta charset="UTF-8" /></p> <p>        <title>背景图片位置title></p> <p>        <style type="text/css"></p> <p>            div{ </p> <p>                width: 300px;</p> <p>                height: 200px;</p> <p>                border: 1px solid silver;</p> <p>                background-image: url("E:/lion.png");</p> <p>                background-repeat: no-repeat;</p> <p>                <strong>background-position: center righ</strong><strong>t</strong><strong>;</strong></p> <p>            }</p> <p>        style></p> <p>    head></p> <p>    <body></p> <p>        <div>div></p> <p>    body></p> <p>html></p> <p><a href="http://img.e-com-net.com/image/info8/7dde878aa5c54ee4b0ce61db4a21c269.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/7dde878aa5c54ee4b0ce61db4a21c269.jpg" alt="div title样式_CSS背景样式_第6张图片" width="650" height="387" style="border:1px solid black;"></a></p> <p><strong>background-attachment</strong></p> <p>    使用background-attachment属性来定义背景图片是随元素一起滚动还是固定不动。</p> <p>    background-attachment属性取值只有2个,如下表</p> <table> <tbody> <tr> <td>属性值</td> <td>说明</td> </tr> <tr> <td>scroll</td> <td>随元素一起滚动</td> </tr> <tr> <td>fixed</td> <td>固定不动</td> </tr> </tbody> </table> <p>DOCTYPE html></p> <p><html></p> <p>    <head></p> <p>        <meta charset="UTF-8" /></p> <p>        <title>背景图片固定title></p> <p>        <style type="text/css"></p> <p>            div{ </p> <p>                width: 200px;</p> <p>                height: 1200px;</p> <p>                border: 1px solid silver;</p> <p>                background-image: url("E:/lion.png");</p> <p>                background-repeat: no-repeat;</p> <p>                <strong>background-attachment: fixed;</strong></p> <p>            }</p> <p>        style></p> <p>    head></p> <p>    <body></p> <p>        <div>div></p> <p>    body></p> <p>html></p> <p>结果如下图</p> <p><a href="http://img.e-com-net.com/image/info8/dae1a7e5783c47e1b7d1451406d9156a.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/dae1a7e5783c47e1b7d1451406d9156a.jpg" alt="div title样式_CSS背景样式_第7张图片" width="650" height="519" style="border:1px solid black;"></a></p> <p>可以看出,右边的滑板都到中间了,但是顶部的图片也相对在顶部。</p> <hr> <p>本节主要学习了背景样式,最后对其总结。</p> <ul> <li><p>背景颜色:background-color</p></li> <li><p>背景图片:background-image</p></li> <li><p>背景图片重复:background-repeat</p></li> <li><p>背景图片位置:background-position</p></li> <li><p>背景图片固定:background-attachment</p></li> </ul> </div> </div> </div> </div> </div> </div> </div> <!--PC和WAP自适应版--> <div id="SOHUCS" sid="1356916179624603648"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script> <!-- 文章页-底部 动态广告位 --> <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad"> <!-- 文章页-右侧1 动态广告位 --> <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div> <!-- 文章页-右侧2 动态广告位 --> <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div> <!-- 文章页-右侧3 动态广告位 --> <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(div,title样式)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1902924265162862592.htm" title="Claude 3.7 Sonnet 根据UI设计稿生成前端html页面" target="_blank">Claude 3.7 Sonnet 根据UI设计稿生成前端html页面</a> <span class="text-muted">徐同保</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/ui/1.htm">ui</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a> <div>UI设计稿:提示词:你是一个前端代码工程师,根据UI设计稿,编写对应html页面,样式写在标签里,类名都以"m-"开头AI回答的结果:根据提供的UI设计稿,我将编写对应的HTML页面,所有类名都以"m-"开头,样式写在标签里。```html账单明细/*重置样式*/*{margin:0;padding:0;box-sizing:border-box;}body{font-family:-apple-</div> </li> <li><a href="/article/1902901305278525440.htm" title="rag-给一篇几百页的pdf,如何从中找到关键信息并汇总出关系图" target="_blank">rag-给一篇几百页的pdf,如何从中找到关键信息并汇总出关系图</a> <span class="text-muted">蒸土豆的技术细节</span> <a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a> <div>小思考对pdf肯定要做模糊chunk,能用模型切分就用模型切分,不能用模型就用规则,规则要尽可能保存连续文本,特殊数据格式(图、表格)必须完整保存,必须能被捕捉到。这些独立的表格or图数据,也要单独做embedding,以其中的title和行列title信息作embedding材料。也不能忘了传统搜索方法,基于搜索的、基于传统词频的、基于关键字的。。。假设已经找到了信息所在的目标,如果它是个表格,</div> </li> <li><a href="/article/1902868249561853952.htm" title="day01-基本查询" target="_blank">day01-基本查询</a> <span class="text-muted"></span> <a class="tag" taget="_blank" href="/search/elasticsearch/1.htm">elasticsearch</a> <div>day011.index3条docPUTbooks/_doc/1{"title":"EffectiveJava","author":"JoshuaBloch","release_date":"2001-06-01","amazon_rating":4.7,"best_seller":true,"prices":{"usd":9.95,"gbp":7.95,"eur":8.95}}PUTbooks/</div> </li> <li><a href="/article/1902863853843181568.htm" title="浏览器工作原理深度解析(阶段一):从 URL 到页面渲染的完整流程" target="_blank">浏览器工作原理深度解析(阶段一):从 URL 到页面渲染的完整流程</a> <span class="text-muted">码农的时光故事</span> <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>一、浏览器工作流程概述作为前端开发者,我们每天都在与浏览器打交道,但多数人对其内部工作机制却知之甚少。实际上,浏览器的核心功能就是将用户输入的URL转换为可视化的网页。这一过程大致分为六个关键步骤:网络请求:通过HTTP/HTTPS协议获取页面资源构建DOM树:解析HTML代码生成文档对象模型样式计算:解析CSS规则并应用到对应元素布局渲染:计算元素位置和尺寸生成渲染树合成优化:将渲染层合并为位图</div> </li> <li><a href="/article/1902797144184647680.htm" title="六十天前端强化训练之第二十一天大师级详解 React Context API:从原理到实战" target="_blank">六十天前端强化训练之第二十一天大师级详解 React Context API:从原理到实战</a> <span class="text-muted">编程星辰海</span> <a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/React/1.htm">React</a><a class="tag" taget="_blank" href="/search/Context/1.htm">Context</a><a class="tag" taget="_blank" href="/search/API/1.htm">API</a> <div>=====欢迎来到编程星辰海的博客讲解======看完可以给一个免费的三连吗,谢谢大佬!目录一、庖丁解牛:深入理解ContextAPI1.1设计哲学与运转机制工作原理三步曲:1.2核心三剑客详解1.3性能优化要诀二、手把手实现主题切换系统2.1完整代码实现(逐行注释版)2.2配套CSS样式设计三、关键知识点拆解3.1状态初始化策略3.2CSS变量注入原理3.3性能优化实践3.4可访问性最佳实践四、</div> </li> <li><a href="/article/1902796640415182848.htm" title="vue2+elementUI项目国际化踩坑记录" target="_blank">vue2+elementUI项目国际化踩坑记录</a> <span class="text-muted">gladShark</span> <a class="tag" taget="_blank" href="/search/elementui/1.htm">elementui</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a> <div>1.前言vue-i18n插件npmivue-i18nvscoder中的i18nAlly插件目录示例有些解决方法是参考各大网友才得到解决的,我也在此记录一下,谢谢大家支持。内容所有示例仅供参考;有些出现问题的地方大家可能没有遇见,忽略就可以;如有写的不足的地方还请大家指正。2.问题2.1data里面数据被页面作为循环体使用页面示例{{munuI18nFunc(item.title)}}exportd</div> </li> <li><a href="/article/1902757544619732992.htm" title="Git使用规范" target="_blank">Git使用规范</a> <span class="text-muted">糖心何包蛋爱编程</span> <a class="tag" taget="_blank" href="/search/git/1.htm">git</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E7%BB%8F%E9%AA%8C%E5%88%86%E4%BA%AB/1.htm">经验分享</a><a class="tag" taget="_blank" href="/search/intellij-idea/1.htm">intellij-idea</a> <div>摘要本文主要讲解Git提交需遵循相应规范。PullRequest方面,一个PR专注一件事。信息填写中,Title分仅含一个commit和多个commit的情况;Content也有要求。还有其它规范,如连接issue,pr完成后要妥善处理,以保证代码提交的高效与规范。开发统一使用git进行版本管理,使用gitsubmodule实现代码模块化。在使用git进行提交和push等操作时需要遵循以下规范。一</div> </li> <li><a href="/article/1902756913993543680.htm" title="【sgFloatDialog】自定义组件:浮动弹窗,支持修改尺寸、拖拽位置、最大化、还原、最小化、复位" target="_blank">【sgFloatDialog】自定义组件:浮动弹窗,支持修改尺寸、拖拽位置、最大化、还原、最小化、复位</a> <span class="text-muted">你挚爱的强哥</span> <a class="tag" taget="_blank" href="/search/Vue.js/1.htm">Vue.js</a><a class="tag" taget="_blank" href="/search/Sg.js%E6%A1%86%E6%9E%B6/1.htm">Sg.js框架</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>sgFloatDialog{{title}}importsgDragMovefrom"@/vue/components/admin/sgDragMove";importsgDragSizefrom"@/vue/components/admin/sgDragSize";exportdefault{name:"sgFloatDialog",components:{sgDragMove,sgDragSi</div> </li> <li><a href="/article/1902739211455361024.htm" title="146.HarmonyOS NEXT系列教程之3D立方体旋转轮播案例讲解之UI构建与样式" target="_blank">146.HarmonyOS NEXT系列教程之3D立方体旋转轮播案例讲解之UI构建与样式</a> <span class="text-muted"></span> <a class="tag" taget="_blank" href="/search/harmonyos-next/1.htm">harmonyos-next</a> <div>温馨提示:本篇博客的详细代码已发布到git:https://gitcode.com/nutpi/HarmonyosNext可以下载运行哦!HarmonyOSNEXT系列教程之3D立方体旋转轮播案例讲解之UI构建与样式效果演示1.UI结构设计1.1基础布局build(){Swiper(this.swiperController){LazyForEach(this.swiperData,(item:E</div> </li> <li><a href="/article/1902688420359106560.htm" title="【Dive Into Stable Diffusion v3.5】1:开源项目正式发布——深入探索SDv3.5模型全参/LoRA/RLHF训练" target="_blank">【Dive Into Stable Diffusion v3.5】1:开源项目正式发布——深入探索SDv3.5模型全参/LoRA/RLHF训练</a> <span class="text-muted">Donvink</span> <a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%A8%A1%E5%9E%8B/1.htm">大模型</a><a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/AIGC/1.htm">AIGC</a><a class="tag" taget="_blank" href="/search/stable/1.htm">stable</a><a class="tag" taget="_blank" href="/search/diffusion/1.htm">diffusion</a><a class="tag" taget="_blank" href="/search/AIGC/1.htm">AIGC</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E6%9C%BA%E5%99%A8%E5%AD%A6%E4%B9%A0/1.htm">机器学习</a><a class="tag" taget="_blank" href="/search/%E6%B7%B1%E5%BA%A6%E5%AD%A6%E4%B9%A0/1.htm">深度学习</a> <div>目录1引言2项目简介3快速上手3.1下载代码3.2环境配置3.3项目结构3.4下载模型与数据集3.5运行指令3.6核心参数说明3.6.1通用参数3.6.2优化器/学习率3.6.3数据相关4结语1引言在人工智能和机器学习领域,生成模型的应用越来越广泛。StableDiffusion作为其中的佼佼者,因其强大的图像生成能力而备受关注。今天,我的开源项目DiveIntoStableDiffusionv3</div> </li> <li><a href="/article/1902653364714401792.htm" title="数据操作与事务:确保数据一致性的关键" target="_blank">数据操作与事务:确保数据一致性的关键</a> <span class="text-muted">qcidyu</span> <a class="tag" taget="_blank" href="/search/%E8%BD%AF%E4%BB%B6%E5%BC%80%E5%8F%91/1.htm">软件开发</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93%E8%A7%84%E5%88%99/1.htm">数据库规则</a> <div>title:数据操作与事务:确保数据一致性的关键date:2025/2/11updated:2025/2/11author:cmdragonexcerpt:在现代数据管理中,事务处理是确保数据完整性和一致性的重要机制。本文将深入探讨事务的ACID特性、锁机制及其种类(行级锁与表级锁)以及事务隔离级别(READUNCOMMITTED、READCOMMITTED、REPEATABLEREAD、SERI</div> </li> <li><a href="/article/1902636729777582080.htm" title="【css酷炫效果】纯CSS实现球形阴影效果" target="_blank">【css酷炫效果】纯CSS实现球形阴影效果</a> <span class="text-muted">冰夏之夜影</span> <a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>【css酷炫效果】纯CSS实现球形阴影效果缘创作背景html结构css样式完整代码基础版进阶版(动态版)效果图想直接拿走的老板,链接放在这里:上传后更新缘创作随缘,不定时更新。创作背景刚看到csdn出活动了,赶时间,直接上代码,令人丧气的是:活动的领域有要求,不是发够就行,瞬间意志消沉。html结构css样式.button{background-image:url('a.gif');border-</div> </li> <li><a href="/article/1902634710253760512.htm" title="Qt爬坑笔记" target="_blank">Qt爬坑笔记</a> <span class="text-muted">klzed_</span> <a class="tag" taget="_blank" href="/search/qt/1.htm">qt</a><a class="tag" taget="_blank" href="/search/c%2B%2B/1.htm">c++</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a><a class="tag" taget="_blank" href="/search/ui/1.htm">ui</a> <div>1.自定义一个QWidget的派生类,将其作为子部件并设置样式表时,需要重写paintEvent事件,否则样式表可能无效,如下所示:voidCustomWidget::paintEvent(QPaintEvent*){QStyleOptionopt;opt.init(this);QPainterp(this);</div> </li> <li><a href="/article/1902630543548280832.htm" title="封装一个分割线组件" target="_blank">封装一个分割线组件</a> <span class="text-muted">小张快跑。</span> <a class="tag" taget="_blank" href="/search/Vue2%E5%B0%81%E8%A3%85%E5%8A%9F%E8%83%BD%E7%BB%84%E4%BB%B6/1.htm">Vue2封装功能组件</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/css3/1.htm">css3</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>最终样式Vue2代码{{title}}exportdefault{name:'SepLine',props:{title:{type:String,default:'照片元数据'//默认值}}}/*样式7*/.sep-line{position:relative;height:28px;width:100%;display:-webkit-box;display:-ms-flexbox;displ</div> </li> <li><a href="/article/1902606884163088384.htm" title="书籍-《动手学深度学习(英文版)》" target="_blank">书籍-《动手学深度学习(英文版)》</a> <span class="text-muted"></span> <div>书籍:DiveintoDeepLearning作者:AstonZhang,ZacharyC.Lipton,MuLi,AlexanderJ.Smola出版:CambridgeUniversityPress编辑:陈萍萍的公主@一点人工一点智能下载:书籍下载-《动手学深度学习(英文版)》01书籍介绍深度学习已经彻底改变了模式识别,为计算机视觉、自然语言处理和自动语音识别等领域提供了强大的工具。应用深度学</div> </li> <li><a href="/article/1902593208039305216.htm" title="初识HTML中的div块元素—零基础自学网页制作" target="_blank">初识HTML中的div块元素—零基础自学网页制作</a> <span class="text-muted">猿说前端</span> <a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/web%E5%BC%80%E5%8F%91/1.htm">web开发</a> <div>块元素基础属性讲解元素是个有故事的元素,这个元素很早就出现在html超文本标记语言中,它设计之初就是为了解决网页页面布局的需求。但是遗憾的是它出生后一直怀才不遇。在我还上初中的时候,智能手机还没有出现,更没有平板电脑等移动设备。上网是通过摆在桌子上的计算机来完成的。那时,大街小巷上有好多网吧。那时,马云刚刚辞去工作准备创业。那时,发送邮件的操作都会出现在计算机课程中。那时,对页面还没有现在的跨平台</div> </li> <li><a href="/article/1902579456048951296.htm" title="安全地自动重新启动 Windows 资源管理器Bat脚本" target="_blank">安全地自动重新启动 Windows 资源管理器Bat脚本</a> <span class="text-muted">小云很优秀</span> <a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E5%B7%A5%E5%85%B7/1.htm">开发工具</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a><a class="tag" taget="_blank" href="/search/windows/1.htm">windows</a><a class="tag" taget="_blank" href="/search/batch%E5%91%BD%E4%BB%A4/1.htm">batch命令</a><a class="tag" taget="_blank" href="/search/microsoft/1.htm">microsoft</a> <div>安全地自动重新启动Windows资源管理器脚本可以直接运行的Windows批处理脚本,用于安全地自动重新启动Windows资源管理器。该脚本会在杀死资源管理器之前检查是否有其他进程正在使用资源管理器相关的文件。Bat脚本@echoofftitle资源管理器安全重启工具color0A::检查是否以管理员权限运行netsession>nul2>&1if%errorLevel%neq0(echo此脚本需</div> </li> <li><a href="/article/1902552600180486144.htm" title="小黑笔记本,写的todolist效果,增删效果,显示隐藏,全部清除效果。" target="_blank">小黑笔记本,写的todolist效果,增删效果,显示隐藏,全部清除效果。</a> <span class="text-muted">YangHuan3</span> <a class="tag" taget="_blank" href="/search/html/1.htm">html</a> <div>先说一下总的大致要去实现的效果:1.新增2.删除3.统计4.清除5.隐藏给大家看一下todoList的大致样式吧!第一个效果:新增1.生成列表结构(v-for数组)2.获取用户输入(v-model)3.回车获取数据(v-on,enter添加数据)第二个效果:删除1.点击删除指定的内容(v-onsplice索引)通过对应的下标删除指定的元素,并且v-for指定的内部是可以获取到当前循环元素下标的,这</div> </li> <li><a href="/article/1902500886098276352.htm" title="uniapp微信小程序分享给好友朋友圈-封装全局分享" target="_blank">uniapp微信小程序分享给好友朋友圈-封装全局分享</a> <span class="text-muted">不法</span> <a class="tag" taget="_blank" href="/search/uniapp/1.htm">uniapp</a><a class="tag" taget="_blank" href="/search/%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">小程序</a><a class="tag" taget="_blank" href="/search/uni-app/1.htm">uni-app</a><a class="tag" taget="_blank" href="/search/%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">小程序</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>不封装直接使用onLoad同级onLoad(){},//1.发送给朋友onShareAppMessage(res){console.log("res",res);console.log("page",uni.$u.page());if(res.from==='button'){//来自页面内分享按钮return{title:'首页',path:'/pages/home/home',imageUrl</div> </li> <li><a href="/article/1902459647470661632.htm" title="2024年9月中国电子学会青少年软件编程(Python)等级考试试卷(三级)答案 + 解析" target="_blank">2024年9月中国电子学会青少年软件编程(Python)等级考试试卷(三级)答案 + 解析</a> <span class="text-muted">Sinsa_SI</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/windows/1.htm">windows</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/%E7%94%B5%E5%AD%90%E5%AD%A6%E4%BC%9A/1.htm">电子学会</a><a class="tag" taget="_blank" href="/search/%E7%AD%89%E7%BA%A7%E8%80%83%E8%AF%95/1.htm">等级考试</a> <div>更多真题在线练习系统:历年真题在线练习系统一、单选题1、以下表达式的值为True的是?()A.all('','1','2','3')B.any([])C.bool('abc')D.divmod(6,0)正确答案:C答案解析:A和B选项,False;D选项,报错;C选项,True。2、下列代码的运行结果是?()l=list(map(float,(1,2,3,4)))print(l)A.[1,2,3,</div> </li> <li><a href="/article/1902459269396099072.htm" title="2024年9月电子学会青少年软件编程Python等级考试(三级)真题试卷" target="_blank">2024年9月电子学会青少年软件编程Python等级考试(三级)真题试卷</a> <span class="text-muted">No0d1es</span> <a class="tag" taget="_blank" href="/search/%E9%9D%92%E5%B0%91%E5%B9%B4%E8%BD%AF%E4%BB%B6%E7%BC%96%E7%A8%8B%EF%BC%88Python%EF%BC%89/1.htm">青少年软件编程(Python)</a><a class="tag" taget="_blank" href="/search/%E7%AD%89%E7%BA%A7%E8%80%83%E8%AF%95%E8%AF%95%E5%8D%B7/1.htm">等级考试试卷</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/%E9%9D%92%E5%B0%91%E5%B9%B4%E7%BC%96%E7%A8%8B/1.htm">青少年编程</a><a class="tag" taget="_blank" href="/search/%E7%94%B5%E5%AD%90%E5%AD%A6%E4%BC%9A/1.htm">电子学会</a><a class="tag" taget="_blank" href="/search/%E4%B8%89%E7%BA%A7/1.htm">三级</a> <div>2024年9月青少年软件编程Python等级考试(三级)真题试卷选择题第1题单选题以下python表达式的值为True的是?()A.all('','1','2','3')B.any([])C.bool('abc')D.divmod(6,0)第2题单选题下列python代码的运行结果是?()l=list(map(float,(1,2,3,4)))print(l)A.[1,2,3,4]B.['1','</div> </li> <li><a href="/article/1902418693653065728.htm" title="Pydantic模型继承解析:从字段继承到多态模型" target="_blank">Pydantic模型继承解析:从字段继承到多态模型</a> <span class="text-muted"></span> <div>title:Pydantic模型继承解析:从字段继承到多态模型date:2025/3/19updated:2025/3/19author:cmdragonexcerpt:涵盖字段继承、属性覆盖、多态模型等关键机制。将掌握类型安全的继承体系构建方法,实现企业级数据校验方案,避免传统面向对象继承的常见陷阱。categories:后端开发FastAPItags:Pydantic模型继承字段覆盖机制多态数</div> </li> <li><a href="/article/1902358365347049472.htm" title="HTML音频、视频--课后作业实践" target="_blank">HTML音频、视频--课后作业实践</a> <span class="text-muted">Heetun</span> <a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a> <div>浅学了web一段时间,用浅显的知识做了一个小小的实践,各位大佬们多多包涵,指正。主要知识重现:标记语法:src:设置媒体文件的路径width、height:设置媒体文件的宽度、高度autostart:逻辑值,true为自动播放;false为不自动播放loop:逻辑值,true自动循环播放;false不循环播放2.CSS的内部样式表选择器1{属性1:属性值1;属性2:属性值2;......}选择器2</div> </li> <li><a href="/article/1902350594786521088.htm" title="CSS中的伪类与伪元素:让样式更加灵活优雅" target="_blank">CSS中的伪类与伪元素:让样式更加灵活优雅</a> <span class="text-muted"></span> <a class="tag" taget="_blank" href="/search/%E7%A8%8B%E5%BA%8F%E5%91%98/1.htm">程序员</a> <div>CSS中的伪类与伪元素:让样式更加灵活优雅在CSS的世界里,伪类和伪元素是两个强大而优雅的特性,它们能让我们的样式代码更加简洁,同时提供更丰富的样式控制能力。今天,让我们深入了解这两个概念。一、伪类(Pseudo-classes)1.1什么是伪类?伪类用于定义元素的特殊状态。它们以单个冒号(:)开头,就像给元素添加了一个虚拟的类,但无需修改HTML结构。1.2常用伪类/*鼠标悬停状态*/butto</div> </li> <li><a href="/article/1902350298547023872.htm" title="如何创建HTML自定义元素:使用 Web Component 的最佳实践" target="_blank">如何创建HTML自定义元素:使用 Web Component 的最佳实践</a> <span class="text-muted">乐闻x</span> <a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/Component/1.htm">Component</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0%E8%AE%B0%E5%BD%95/1.htm">学习记录</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/web/1.htm">web</a><a class="tag" taget="_blank" href="/search/component/1.htm">component</a> <div>什么是WebComponent?WebComponent是一组允许开发者创建可复用、自定义HTML元素的技术。它们使得我们可以像原生HTML标签一样使用这些自定义元素,从而提升代码的模块化和复用性。WebComponent的核心技术有以下三部分:CustomElements(自定义元素):允许开发者定义自己的HTML标签。ShadowDOM(影子DOM):为元素提供封装的DOM和样式,让组件内部的</div> </li> <li><a href="/article/1902348661065576448.htm" title="css知识点总结" target="_blank">css知识点总结</a> <span class="text-muted">吃橘子的Crow</span> <a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>1.css概述css是CascadingStyleSheets(级联样式表)css是一种样式表语言,用于为HTML文档控制外观,定义布局.可将页面的内容与表现形式分离,页面内容存放在HTML文档中,而用于定义白线形式的css在一个.css文件中或HTML文档的某一部分HTML如同网页的骨架,css如同修饰骨架的装饰品(样式)2.基本语法1.行内样式表行内样式表,又称内联样式、行间样式、内嵌样式。是</div> </li> <li><a href="/article/1902338202086207488.htm" title="【css酷炫效果】纯CSS实现动态云雾效果" target="_blank">【css酷炫效果】纯CSS实现动态云雾效果</a> <span class="text-muted">冰夏之夜影</span> <a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>【css酷炫效果】纯CSS实现动态云雾效果缘创作背景html结构css样式完整代码效果图想直接拿走的老板,链接放在这里:上传后更新缘创作随缘,不定时更新。创作背景刚看到csdn出活动了,赶时间,直接上代码。html结构css样式body{margin:0;min-height:100vh;}.cloud-bg{position:relative;height:100vh;background:ra</div> </li> <li><a href="/article/1902338202564358144.htm" title="【css酷炫效果】纯CSS实现流动岩浆纹理效果" target="_blank">【css酷炫效果】纯CSS实现流动岩浆纹理效果</a> <span class="text-muted">冰夏之夜影</span> <a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>【css酷炫效果】纯CSS实现流动岩浆纹理效果缘创作背景html结构css样式完整代码效果图想直接拿走的老板,链接放在这里:上传后更新缘创作随缘,不定时更新。创作背景刚看到csdn出活动了,赶时间,直接上代码。html结构css样式.lava-texture{position:relative;width:400px;height:300px;overflow:hidden;border-radi</div> </li> <li><a href="/article/1902338075883794432.htm" title="【css酷炫效果】实现鱼群游动动态效果" target="_blank">【css酷炫效果】实现鱼群游动动态效果</a> <span class="text-muted">冰夏之夜影</span> <a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF/1.htm">web前端</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>【css酷炫效果】实现小鱼游动动态效果缘创作背景css代码创建div容器引入jquery引入鱼群js完整代码效果图成品资源下载链接:点击下载缘在开发系统功能的时候,无意间看到了小鱼游动特效,感觉很有意思,就在网上找了相关教程,分享给大家。创作背景刚看到csdn出活动了,赶时间,直接上代码。css代码.container{background-color:transparent;position:f</div> </li> <li><a href="/article/1902326474174689280.htm" title="微信小程序:修改提示信息placeholder颜色" target="_blank">微信小程序:修改提示信息placeholder颜色</a> <span class="text-muted">25号底片~</span> <a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">微信小程序</a><a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">微信小程序</a><a class="tag" taget="_blank" href="/search/%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">小程序</a> <div>方法一:使用placeholder-style直接在input或textarea组件中使用placeholder-style属性来设置placeholder的样式。或者:方法二:使用placeholder-class你也可以通过placeholder-class属性来指定一个类名,然后在对应的.wxss文件中定义这个类的样式。wxss.custom-placeholder{color:#999;f</div> </li> <li><a href="/article/47.htm" title="jdk tomcat 环境变量配置" target="_blank">jdk tomcat 环境变量配置</a> <span class="text-muted">Array_06</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/jdk/1.htm">jdk</a><a class="tag" taget="_blank" href="/search/tomcat/1.htm">tomcat</a> <div>Win7 下如何配置java环境变量 1。准备jdk包,win7系统,tomcat安装包(均上网下载即可) 2。进行对jdk的安装,尽量为默认路径(但要记住啊!!以防以后配置用。。。) 3。分别配置高级环境变量。   电脑-->右击属性-->高级环境变量-->环境变量。 分别配置 : path    &nbs</div> </li> <li><a href="/article/174.htm" title="Spring调SDK包报java.lang.NoSuchFieldError错误" target="_blank">Spring调SDK包报java.lang.NoSuchFieldError错误</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a> <div>        在工作中调另一个系统的SDK包,出现如下java.lang.NoSuchFieldError错误。 org.springframework.web.util.NestedServletException: Handler processing failed; nested exception is java.l</div> </li> <li><a href="/article/301.htm" title="LeetCode[位运算] - #136 数组中的单一数" target="_blank">LeetCode[位运算] - #136 数组中的单一数</a> <span class="text-muted">Cwind</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E9%A2%98%E8%A7%A3/1.htm">题解</a><a class="tag" taget="_blank" href="/search/%E4%BD%8D%E8%BF%90%E7%AE%97/1.htm">位运算</a><a class="tag" taget="_blank" href="/search/LeetCode/1.htm">LeetCode</a><a class="tag" taget="_blank" href="/search/Algorithm/1.htm">Algorithm</a> <div>原题链接:#136 Single Number 要求: 给定一个整型数组,其中除了一个元素之外,每个元素都出现两次。找出这个元素 注意:算法的时间复杂度应为O(n),最好不使用额外的内存空间 难度:中等 分析: 题目限定了线性的时间复杂度,同时不使用额外的空间,即要求只遍历数组一遍得出结果。由于异或运算 n XOR n = 0, n XOR 0 = n,故将数组中的每个元素进</div> </li> <li><a href="/article/428.htm" title="qq登陆界面开发" target="_blank">qq登陆界面开发</a> <span class="text-muted">15700786134</span> <a class="tag" taget="_blank" href="/search/qq/1.htm">qq</a> <div>今天我们来开发一个qq登陆界面,首先写一个界面程序,一个界面首先是一个Frame对象,即是一个窗体。然后在这个窗体上放置其他组件。代码如下: public class First {         public void initul(){        jf=ne</div> </li> <li><a href="/article/555.htm" title="Linux的程序包管理器RPM" target="_blank">Linux的程序包管理器RPM</a> <span class="text-muted">被触发</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>在早期我们使用源代码的方式来安装软件时,都需要先把源程序代码编译成可执行的二进制安装程序,然后进行安装。这就意味着每次安装软件都需要经过预处理-->编译-->汇编-->链接-->生成安装文件--> 安装,这个复杂而艰辛的过程。为简化安装步骤,便于广大用户的安装部署程序,程序提供商就在特定的系统上面编译好相关程序的安装文件并进行打包,提供给大家下载,我们只需要根据自己的</div> </li> <li><a href="/article/682.htm" title="socket通信遇到EOFException" target="_blank">socket通信遇到EOFException</a> <span class="text-muted">肆无忌惮_</span> <a class="tag" taget="_blank" href="/search/EOFException/1.htm">EOFException</a> <div>java.io.EOFException at java.io.ObjectInputStream$PeekInputStream.readFully(ObjectInputStream.java:2281) at java.io.ObjectInputStream$BlockDataInputStream.readShort(ObjectInputStream.java:</div> </li> <li><a href="/article/809.htm" title="基于spring的web项目定时操作" target="_blank">基于spring的web项目定时操作</a> <span class="text-muted">知了ing</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a> <div>废话不多说,直接上代码,很简单 配置一下项目启动就行 1,web.xml <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="h</div> </li> <li><a href="/article/936.htm" title="树形结构的数据库表Schema设计" target="_blank">树形结构的数据库表Schema设计</a> <span class="text-muted">矮蛋蛋</span> <a class="tag" taget="_blank" href="/search/schema/1.htm">schema</a> <div>原文地址: http://blog.csdn.net/MONKEY_D_MENG/article/details/6647488     程序设计过程中,我们常常用树形结构来表征某些数据的关联关系,如企业上下级部门、栏目结构、商品分类等等,通常而言,这些树状结构需要借助于数据库完成持久化。然而目前的各种基于关系的数据库,都是以二维表的形式记录存储数据信息,</div> </li> <li><a href="/article/1063.htm" title="maven将jar包和源码一起打包到本地仓库" target="_blank">maven将jar包和源码一起打包到本地仓库</a> <span class="text-muted">alleni123</span> <a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a> <div>http://stackoverflow.com/questions/4031987/how-to-upload-sources-to-local-maven-repository <project> ... <build> <plugins> <plugin> <groupI</div> </li> <li><a href="/article/1190.htm" title="java IO操作 与 File 获取文件或文件夹的大小,可读,等属性!!!" target="_blank">java IO操作 与 File 获取文件或文件夹的大小,可读,等属性!!!</a> <span class="text-muted">百合不是茶</span> <div>类 File File是指文件和目录路径名的抽象表示形式。 1,何为文件: 标准文件(txt doc mp3...) 目录文件(文件夹) 虚拟内存文件   2,File类中有可以创建文件的 createNewFile()方法,在创建新文件的时候需要try{} catch(){}因为可能会抛出异常;也有可以判断文件是否是一个标准文件的方法isFile();这些防抖都</div> </li> <li><a href="/article/1317.htm" title="Spring注入有继承关系的类(2)" target="_blank">Spring注入有继承关系的类(2)</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a> <div>被注入类的父类有相应的属性,Spring可以直接注入相应的属性,如下所例:1.AClass类 package com.bijian.spring.test4; public class AClass { private String a; private String b; public String getA() { retu</div> </li> <li><a href="/article/1444.htm" title="30岁转型期你能否成为成功人士" target="_blank">30岁转型期你能否成为成功人士</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/%E6%88%90%E9%95%BF/1.htm">成长</a><a class="tag" taget="_blank" href="/search/%E5%8A%B1%E5%BF%97/1.htm">励志</a> <div>        很多人由于年轻时走了弯路,到了30岁一事无成,这样的例子大有人在。但同样也有一些人,整个职业生涯都发展得很优秀,到了30岁已经成为职场的精英阶层。由于做猎头的原因,我们接触很多30岁左右的经理人,发现他们在职业发展道路上往往有很多致命的问题。在30岁之前,他们的职业生涯表现很优秀,但从30岁到40岁这一段,很多人</div> </li> <li><a href="/article/1571.htm" title="【Velocity四】Velocity与Java互操作" target="_blank">【Velocity四】Velocity与Java互操作</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/velocity/1.htm">velocity</a> <div>Velocity出现的目的用于简化基于MVC的web应用开发,用于替代JSP标签技术,那么Velocity如何访问Java代码.本篇继续以Velocity三http://bit1129.iteye.com/blog/2106142中的例子为基础,      POJO    package com.tom.servlets; public</div> </li> <li><a href="/article/1698.htm" title="【Hive十一】Hive数据倾斜优化" target="_blank">【Hive十一】Hive数据倾斜优化</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/hive/1.htm">hive</a> <div>什么是Hive数据倾斜问题   操作:join,group by,count distinct 现象:任务进度长时间维持在99%(或100%),查看任务监控页面,发现只有少量(1个或几个)reduce子任务未完成;查看未完成的子任务,可以看到本地读写数据量积累非常大,通常超过10GB可以认定为发生数据倾斜。 原因:key分布不均匀 倾斜度衡量:平均记录数超过50w且</div> </li> <li><a href="/article/1825.htm" title="在nginx中集成lua脚本:添加自定义Http头,封IP等" target="_blank">在nginx中集成lua脚本:添加自定义Http头,封IP等</a> <span class="text-muted">ronin47</span> <a class="tag" taget="_blank" href="/search/nginx+lua+csrf/1.htm">nginx lua csrf</a> <div>Lua是一个可以嵌入到Nginx配置文件中的动态脚本语言,从而可以在Nginx请求处理的任何阶段执行各种Lua代码。刚开始我们只是用Lua 把请求路由到后端服务器,但是它对我们架构的作用超出了我们的预期。下面就讲讲我们所做的工作。 强制搜索引擎只索引mixlr.com Google把子域名当作完全独立的网站,我们不希望爬虫抓取子域名的页面,降低我们的Page rank。 location /{</div> </li> <li><a href="/article/1952.htm" title="java-3.求子数组的最大和" target="_blank">java-3.求子数组的最大和</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>package beautyOfCoding; public class MaxSubArraySum { /** * 3.求子数组的最大和 题目描述: 输入一个整形数组,数组里有正数也有负数。 数组中连续的一个或多个整数组成一个子数组,每个子数组都有一个和。 求所有子数组的和的最大值。要求时间复杂度为O(n)。 例如输入的数组为1, -2, 3, 10, -4,</div> </li> <li><a href="/article/2079.htm" title="Netty源码学习-FileRegion" target="_blank">Netty源码学习-FileRegion</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/netty/1.htm">netty</a> <div>今天看org.jboss.netty.example.http.file.HttpStaticFileServerHandler.java 可以直接往channel里面写入一个FileRegion对象,而不需要相应的encoder: //pipeline(没有诸如“FileRegionEncoder”的handler): public ChannelPipeline ge</div> </li> <li><a href="/article/2206.htm" title="使用ZeroClipboard解决跨浏览器复制到剪贴板的问题" target="_blank">使用ZeroClipboard解决跨浏览器复制到剪贴板的问题</a> <span class="text-muted">cngolon</span> <a class="tag" taget="_blank" href="/search/%E8%B7%A8%E6%B5%8F%E8%A7%88%E5%99%A8/1.htm">跨浏览器</a><a class="tag" taget="_blank" href="/search/%E5%A4%8D%E5%88%B6%E5%88%B0%E7%B2%98%E8%B4%B4%E6%9D%BF/1.htm">复制到粘贴板</a><a class="tag" taget="_blank" href="/search/Zero+Clipboard/1.htm">Zero Clipboard</a> <div>Zero Clipboard的实现原理 Zero Clipboard 利用透明的Flash让其漂浮在复制按钮之上,这样其实点击的不是按钮而是 Flash ,这样将需要的内容传入Flash,再通过Flash的复制功能把传入的内容复制到剪贴板。 Zero Clipboard的安装方法 首先需要下载 Zero Clipboard的压缩包,解压后把文件夹中两个文件:ZeroClipboard.js </div> </li> <li><a href="/article/2333.htm" title="单例模式" target="_blank">单例模式</a> <span class="text-muted">cuishikuan</span> <a class="tag" taget="_blank" href="/search/%E5%8D%95%E4%BE%8B%E6%A8%A1%E5%BC%8F/1.htm">单例模式</a> <div>第一种(懒汉,线程不安全): public class Singleton {   2     private static Singleton instance;   3     pri</div> </li> <li><a href="/article/2460.htm" title="spring+websocket的使用" target="_blank">spring+websocket的使用</a> <span class="text-muted">dalan_123</span> <div>一、spring配置文件 <?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.springframework.org/schema/beans"    xmlns:xsi="http://www.w3.or</div> </li> <li><a href="/article/2587.htm" title="细节问题:ZEROFILL的用法范围。" target="_blank">细节问题:ZEROFILL的用法范围。</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div> 1、zerofill把月份中的一位数字比如1,2,3等加前导0 mysql> CREATE TABLE t1 (year YEAR(4), month INT(2) UNSIGNED ZEROFILL,    -> day</div> </li> <li><a href="/article/2714.htm" title="Android开发10——Activity的跳转与传值" target="_blank">Android开发10——Activity的跳转与传值</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/Android%E5%BC%80%E5%8F%91/1.htm">Android开发</a> <div>Activity跳转与传值,主要是通过Intent类,Intent的作用是激活组件和附带数据。   一、Activity跳转 方法一Intent intent = new Intent(A.this, B.class); startActivity(intent)   方法二Intent intent = new Intent();intent.setCla</div> </li> <li><a href="/article/2841.htm" title="jdbc 得到表结构、主键" target="_blank">jdbc 得到表结构、主键</a> <span class="text-muted">eksliang</span> <a class="tag" taget="_blank" href="/search/jdbc+%E5%BE%97%E5%88%B0%E8%A1%A8%E7%BB%93%E6%9E%84%E3%80%81%E4%B8%BB%E9%94%AE/1.htm">jdbc 得到表结构、主键</a> <div>转自博客:http://blog.csdn.net/ocean1010/article/details/7266042 假设有个con DatabaseMetaData dbmd = con.getMetaData(); rs = dbmd.getColumns(con.getCatalog(), schema, tableName, null); rs.getSt</div> </li> <li><a href="/article/2968.htm" title="Android 应用程序开关GPS" target="_blank">Android 应用程序开关GPS</a> <span class="text-muted">gqdy365</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a> <div>要在应用程序中操作GPS开关需要权限: <uses-permission android:name="android.permission.WRITE_SECURE_SETTINGS" /> 但在配置文件中添加此权限之后会报错,无法再eclipse里面正常编译,怎么办? 1、方法一:将项目放到Android源码中编译; 2、方法二:网上有人说cl</div> </li> <li><a href="/article/3095.htm" title="Windows上调试MapReduce" target="_blank">Windows上调试MapReduce</a> <span class="text-muted">zhiquanliu</span> <a class="tag" taget="_blank" href="/search/mapreduce/1.htm">mapreduce</a> <div>1.下载hadoop2x-eclipse-plugin https://github.com/winghc/hadoop2x-eclipse-plugin.git 把 hadoop2.6.0-eclipse-plugin.jar 放到eclipse plugin 目录中。 2.下载 hadoop2.6_x64_.zip http://dl.iteye.com/topics/download/d2b</div> </li> <li><a href="/article/3222.htm" title="如何看待一些知名博客推广软文的行为?" target="_blank">如何看待一些知名博客推广软文的行为?</a> <span class="text-muted">justjavac</span> <a class="tag" taget="_blank" href="/search/%E5%8D%9A%E5%AE%A2/1.htm">博客</a> <div>本文来自我在知乎上的一个回答:http://www.zhihu.com/question/23431810/answer/24588621 互联网上的两种典型心态: 当初求种像条狗,如今撸完嫌人丑 当初搜贴像条犬,如今读完嫌人软 你为啥感觉不舒服呢? 难道非得要作者把自己的劳动成果免费给你用,你才舒服? 就如同 Google 关闭了 Gooled Reader,那是</div> </li> <li><a href="/article/3349.htm" title="sql优化总结" target="_blank">sql优化总结</a> <span class="text-muted">macroli</span> <a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a> <div>为了是自己对sql优化有更好的原则性,在这里做一下总结,个人原则如有不对请多多指教。谢谢!   要知道一个简单的sql语句执行效率,就要有查看方式,一遍更好的进行优化。   一、简单的统计语句执行时间 declare @d datetime ---定义一个datetime的变量set @d=getdate() ---获取查询语句开始前的时间select user_id</div> </li> <li><a href="/article/3476.htm" title="Linux Oracle中常遇到的一些问题及命令总结" target="_blank">Linux Oracle中常遇到的一些问题及命令总结</a> <span class="text-muted">超声波</span> <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>1.linux更改主机名   (1)#hostname oracledb    临时修改主机名 (2) vi /etc/sysconfig/network   修改hostname (3) vi /etc/hosts        修改IP对应的主机名   2.linux重启oracle实例及监听的各种方法 (注意操作的顺序应该是先监听,后数据库实例) &nbs</div> </li> <li><a href="/article/3603.htm" title="hive函数大全及使用示例" target="_blank">hive函数大全及使用示例</a> <span class="text-muted">superlxw1234</span> <a class="tag" taget="_blank" href="/search/hadoop/1.htm">hadoop</a><a class="tag" taget="_blank" href="/search/hive%E5%87%BD%E6%95%B0/1.htm">hive函数</a> <div>  具体说明及示例参 见附件文档。     文档目录:   目录 一、关系运算: 4 1. 等值比较: = 4 2. 不等值比较: <> 4 3. 小于比较: < 4 4. 小于等于比较: <= 4 5. 大于比较: > 5 6. 大于等于比较: >= 5 7. 空值判断: IS NULL 5</div> </li> <li><a href="/article/3730.htm" title="Spring 4.2新特性-使用@Order调整配置类加载顺序" target="_blank">Spring 4.2新特性-使用@Order调整配置类加载顺序</a> <span class="text-muted">wiselyman</span> <a class="tag" taget="_blank" href="/search/spring+4/1.htm">spring 4</a> <div>4.1 @Order Spring 4.2 利用@Order控制配置类的加载顺序 4.2 演示 两个演示bean package com.wisely.spring4_2.order; public class Demo1Service { } package com.wisely.spring4_2.order; public class</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> <strong>按字母分类:</strong> <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a> </div> </div> </div> <footer id="footer" class="mb30 mt30"> <div class="container"> <div class="footBglm"> <a target="_blank" href="/">首页</a> - <a target="_blank" href="/custom/about.htm">关于我们</a> - <a target="_blank" href="/search/Java/1.htm">站内搜索</a> - <a target="_blank" href="/sitemap.txt">Sitemap</a> - <a target="_blank" href="/custom/delete.htm">侵权投诉</a> </div> <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved. <!-- <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">京ICP备09083238号</a><br>--> </div> </div> </footer> <!-- 代码高亮 --> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script> <link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/> <script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script> </body> </html>