耳东蜗牛

CSS - 选择器应用（自定义复选框 & 单选框）

当CSS 最初出现时，它对表单元素的样式控制力是极为有限的，而且现在仍然没有哪个CSS 规范明确定义了这方面的行为。不过这些年来，各种浏览器已经在逐步放开CSS 属性对表单控件的作用范围，从而允许我们设置大多数表单控件的样式。不幸的是，复选框和单选框不在此列。直到今天，这两种控件在绝大多数浏览器中仍然是几乎或完全无法设置样式的。

先看一下当前的复选框的样式，chorme浏览器默认样式。而且我们定义的背景颜色是没有应用到复选框的样式。但是目前我们想要自定义复选框的样式。

解决方案

通过前一章的学习，我们得到了一个新的伪类:checked。这个伪类只在复选框被勾选时才会匹配，不论这个勾选状态是由用户交互触发，还是由脚本触发。如果直接对复选框设置样式，那么这个伪类并不实用，因为（前面已经交待过了）没有多少样式能够对复选框起作用。不过，我们倒是可以基于复选框的勾选状态借助组合选择符来给其他元素设置样式。

替换元素和不可替换元素

替换元素

替换元素根据其标签和属性来决定元素的具体显示内容.有

<select><object>。</span><br><span style="font-size:14px;">替换一般有内在尺寸即img默认的是其图片的宽高，input也有默认的尺寸。img和input的宽高可以设定。</span><br><br></span> 
  <p><span style="font-family:'FangSong_GB2312';"><span style="font-size:14px;"><strong>不可替换元素</strong></span></span></p> 
  <span style="font-family:'FangSong_GB2312';"><span style="font-size:14px;">即将内容直接表现给用户端</span><br><br></span> 
  <h1><span style="font-family:'FangSong_GB2312';font-size:24px;">Process</span></h1> 
  <p><span style="font-family:'FangSong_GB2312';"><span style="font-size:14px;">其实有一个元素总是跟复选框形影不离、息息相关，它就是<label>（标签元素）。当<label> 元素与复选框关联之后，也可以起到触发开关的作用。</span></span></p> 
  <p><span style="font-family:'FangSong_GB2312';"><span style="font-size:14px;">由于label 不是复选框那样的替换元素，我们可以为它添加生成性内容（伪元素），并基于复选框的状态来为其设置样式。</span></span></p> 
  <p><span style="font-size:14px;font-family:'FangSong_GB2312';">然后，就可以把真正的复选框隐藏起来（但不能把它从tab 键切换焦点的队列中完全删除），再把生成性内容美化一番，用来顶替原来的复选框！<br><br></span></p> 
  <h2><span style="font-family:'FangSong_GB2312';"><span style="font-size:16px;">(1) 首先利用伪元素:bofore添加一个“复选框”</span></span></h2> 
  <pre><code class="language-html"><style>
    input[type="checkbox"] + label::before {
		content: '\a0'; /* 不换行空格 */
		display: inline-block;
		vertical-align: .2em;
		width: .8em;
		height: .8em;
		margin-right: .2em;
		border-radius: .2em;
		background: silver;
		text-indent: .15em;
		line-height: .65;
	}
</style></code></pre> 
  <p><span style="font-family:'FangSong_GB2312';"><span style="font-size:14px;">可以看到当前的复选框模型已经有了。</span></span></p> 
  <span style="font-family:'FangSong_GB2312';"><a href="http://img.e-com-net.com/image/info8/36e44da94de44d50af93d4d68cc073c8.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/36e44da94de44d50af93d4d68cc073c8.jpg" alt="" width="167" height="41"></a><br><br></span> 
  <h2><span style="font-family:'FangSong_GB2312';font-size:16px;">(2) 给复选框的勾选状态加上不同的样式。样式可以很简单，比如换种颜色，再加上勾选标记</span></h2> 
  <span style="font-family:'FangSong_GB2312';"></span> 
  <pre><code class="language-html"><style>
    input[type="checkbox"] + label::before {
        content: '\a0'; /* 不换行空格 */
        display: inline-block;
        vertical-align: .2em;
        width: .8em;
        height: .8em;
        margin-right: .2em;
        border-radius: .2em;
        background: silver;
        text-indent: .15em;
        line-height: .65;
    }

input[type="checkbox"]:checked + label::before {
        content: '\2713'; /*添加勾选状态*/
        background: yellowgreen;
    }
</style></code></pre> 
  <a href="http://img.e-com-net.com/image/info8/66ef8e6805b044acac8f3694b93863dd.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/66ef8e6805b044acac8f3694b93863dd.jpg" alt="" width="176" height="46"></a> 
  <br> 
  <br> 
  <h2><span style="font-family:'FangSong_GB2312';font-size:16px;">(3) 隐藏原来复选框</span></h2> 
  <p><span style="font-family:'FangSong_GB2312';"><span style="font-size:14px;">我们需要把原来的复选框以一种不损失可访问性的方式隐藏起来。这意味着不能使用display: none，因为那样会把它从键盘tab 键切换焦点的队列中完全删除。我们改用另一种方法来达到目的:</span></span></p> 
  <pre><code class="language-html"><style>
    input[type="checkbox"] + label::before {
        content: '\a0'; /* 不换行空格 */
        display: inline-block;
        vertical-align: .2em;
        width: .8em;
        height: .8em;
        margin-right: .2em;
        border-radius: .2em;
        background: silver;
        text-indent: .15em;
        line-height: .65;
    }

input[type="checkbox"]:checked + label::before {
        content: '\2713';
        background: yellowgreen;
    }

input[type="checkbox"] {
        position: absolute;
        clip: rect(0,0,0,0);
    }
</style></code></pre> 
  <p><span style="font-family:'FangSong_GB2312';"><a href="http://img.e-com-net.com/image/info8/e4ac76809e68467e98e9ae161059059f.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/e4ac76809e68467e98e9ae161059059f.jpg" alt="" width="186" height="46"></a><br></span></p> 
  <p><span style="font-family:'FangSong_GB2312';"><br></span></p> 
  <h1><span style="font-family:'FangSong_GB2312';font-size:24px;">延伸：content中的图标问题</span></h1> 
  <p><span style="font-family:'FangSong_GB2312';"><span style="font-size:14px;">在CSS Content里使用特殊的字符有点怪异，需要使用ASCII码，可以查询。请看下图：</span></span></p> 
  <span style="font-family:'FangSong_GB2312';"><a href="http://img.e-com-net.com/image/info8/3e7b52e2cdd64a3f911f4c0b6eceda48.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/3e7b52e2cdd64a3f911f4c0b6eceda48.jpg" alt="CSS - 选择器应用（自定义复选框 & 单选框）_第1张图片" width="650" height="104" style="border:1px solid black;"></a><br></span> 
  <p><span style="font-family:'FangSong_GB2312';"><span style="font-size:14px;">上图中可以获取当前的ASCII代码：√，然后在网页中输入ASCII码：然后得到我们的结果</span></span><span style="font-size:14px;font-family:'FangSong_GB2312';">。</span></p> 
  <p><a href="http://img.e-com-net.com/image/info8/44b0fcc834ab4506b83f7310c0686e11.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/44b0fcc834ab4506b83f7310c0686e11.jpg" alt="CSS - 选择器应用（自定义复选框 & 单选框）_第2张图片" width="650" height="190" style="border:1px solid black;"></a><br></p> 
  <h2><span style="font-family:'FangSong_GB2312';font-size:18px;"><br></span></h2> 
  <h2><span style="font-family:'FangSong_GB2312';font-size:18px;">下面这些比较常用</span></h2> 
  <span style="font-family:'FangSong_GB2312';"><strong><span style="font-size:14px;">\2018 - 左单引号</span><br><span style="font-size:14px;">\2019 -右单引号</span><br><span style="font-size:14px;">\00A9 - 版权</span><br><span style="font-size:14px;">\2713 - 对号</span><br><span style="font-size:14px;">\2192 - 右箭头</span><br><span style="font-size:14px;">\2190 - 左箭头</span></strong></span> 
 </div> 
</div>
                            </div>
                        </div>
                    </div>
                    
                    <div id="SOHUCS" sid="1283279877688016896"></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">
                        
                        <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>
                        
                        <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>
                        
                        <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">你可能感兴趣的:(CSS)</h4>
        <div id="paradigm-article-related">
            <div class="recommend-post mb30">
                <ul class="widget-links">
                    <li><a href="/article/1835498925755297792.htm"
                           title="DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理" target="_blank">DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理</a>
                        <span class="text-muted">STU学生网页设计</span>
<a class="tag" taget="_blank" href="/search/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1/1.htm">网页设计</a><a class="tag" taget="_blank" href="/search/%E6%9C%9F%E6%9C%AB%E7%BD%91%E9%A1%B5%E4%BD%9C%E4%B8%9A/1.htm">期末网页作业</a><a class="tag" taget="_blank" href="/search/html%E9%9D%99%E6%80%81%E7%BD%91%E9%A1%B5/1.htm">html静态网页</a><a class="tag" taget="_blank" href="/search/html5%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">html5期末大作业</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1/1.htm">网页设计</a><a class="tag" taget="_blank" href="/search/web%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web大作业</a>
                        <div>️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程</div>
                    </li>
                    <li><a href="/article/1835496149843275776.htm"
                           title="关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript" target="_blank">关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript</a>
                        <span class="text-muted">二挡起步</span>
<a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web前端期末大作业</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E6%97%85%E6%B8%B8/1.htm">旅游</a><a class="tag" taget="_blank" href="/search/%E9%A3%8E%E6%99%AF/1.htm">风景</a>
                        <div>⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip</div>
                    </li>
                    <li><a href="/article/1835496148601761792.htm"
                           title="HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动" target="_blank">HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动</a>
                        <span class="text-muted">二挡起步</span>
<a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web前端期末大作业</a><a class="tag" taget="_blank" href="/search/web%E8%AE%BE%E8%AE%A1%E7%BD%91%E9%A1%B5%E8%A7%84%E5%88%92%E4%B8%8E%E8%AE%BE%E8%AE%A1/1.htm">web设计网页规划与设计</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/dreamweaver/1.htm">dreamweaver</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
                        <div>Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线</div>
                    </li>
                    <li><a href="/article/1835493267907637248.htm"
                           title="webpack图片等资源的处理" target="_blank">webpack图片等资源的处理</a>
                        <span class="text-muted">dmengmeng</span>

<div>需要的loaderfile-loader（让我们可以引入这些资源文件）url-loader（其实是file-loader的二次封装）img-loader（处理图片所需要的）在没有使用任何处理图片的loader之前，比如说css中用到了背景图片，那么最后打包会报错的，因为他没办法处理图片。其实你只想能够使用图片的话。只加一个file-loader就可以，打开网页能准确看到图片。{test:/\.(p</div>
                    </li>
                    <li><a href="/article/1835389111658180608.htm"
                           title="《HTML 与 CSS—— 响应式设计》" target="_blank">《HTML 与 CSS—— 响应式设计》</a>
                        <span class="text-muted">陈在天box</span>
<a class="tag" taget="_blank" href="/search/html/1.htm">html</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>一、引言在当今数字化时代，人们使用各种不同的设备访问互联网，包括智能手机、平板电脑、笔记本电脑和台式机等。为了确保网站在不同设备上都能提供良好的用户体验，响应式设计成为了网页开发的关键。HTML和CSS作为网页开发的基础技术，在实现响应式设计方面发挥着重要作用。本文将深入探讨HTML与CSS中的响应式设计原理、方法和最佳实践。二、响应式设计的概念与重要性（一）概念响应式设计是一种网页设计方法，旨在</div>
                    </li>
                    <li><a href="/article/1835382685745377280.htm"
                           title="html+css网页设计 旅游网站首页1个页面" target="_blank">html+css网页设计 旅游网站首页1个页面</a>
                        <span class="text-muted">html+css+js网页设计</span>
<a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E6%97%85%E6%B8%B8/1.htm">旅游</a>
                        <div>html+css网页设计旅游网站首页1个页面网页作品代码简单，可使用任意HTML辑软件（如：Dreamweaver、HBuilder、Vscode、Sublime、Webstorm、Text、Notepad++等任意html编辑软件进行运行及修改编辑等操作）。获取源码1，访问该网站https://download.csdn.net/download/qq_42431718/897527112，点击</div>
                    </li>
                    <li><a href="/article/1835376505543290880.htm"
                           title="css设置当字数超过限制后以省略号（...）显示" target="_blank">css设置当字数超过限制后以省略号（...）显示</a>
                        <span class="text-muted">周bro</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><a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a><a class="tag" taget="_blank" href="/search/css3/1.htm">css3</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E7%BB%8F%E9%AA%8C%E5%88%86%E4%BA%AB/1.htm">经验分享</a>
                        <div>1、文字超出一行，省略超出部分，显示’…’用text-overflow:ellipsis属性来，当然还需要加宽度width属来兼容部分浏览。overflow:hidden;text-overflow:ellipsis;white-space:nowrap;2、多行文本溢出显示省略号display:-webkit-box;-webkit-box-orient:vertical;-webkit-lin</div>
                    </li>
                    <li><a href="/article/1835373236217540608.htm"
                           title="360前端星计划-动画可以这么玩" target="_blank">360前端星计划-动画可以这么玩</a>
                        <span class="text-muted">马小蜗</span>

<div>动画的基本原理定时器改变对象的属性根据新的属性重新渲染动画functionupdate(context){//更新属性}constticker=newTicker();ticker.tick(update,context);动画的种类1、JavaScript动画操作DOMCanvas2、CSS动画transitionanimation3、SVG动画SMILJS动画的优缺点优点：灵活度、可控性、性能</div>
                    </li>
                    <li><a href="/article/1835362025719558144.htm"
                           title="css2中的透明" target="_blank">css2中的透明</a>
                        <span class="text-muted">琪33</span>

<div>.out{width:400px;height:400px;background-color:blue;margin:100pxauto;border:1pxsolid#000;opacity:0.6;}.in{width:200px;height:200px;background-color:red;margin:100pxauto;}</div>
                    </li>
                    <li><a href="/article/1835359727924637696.htm"
                           title="Nginx从入门到实践(三)" target="_blank">Nginx从入门到实践(三)</a>
                        <span class="text-muted">听你讲故事啊</span>

<div>动静分离动静分离是将网站静态资源（JavaScript，CSS，img等文件）与后台应用分开部署，提高用户访问静态代码的速度，降低对后台应用访问。动静分离的一种做法是将静态资源部署在nginx上，后台项目部署到应用服务器上，根据一定规则静态资源的请求全部请求nginx服务器，达到动静分离的目标。rewrite规则Rewrite规则常见正则表达式Rewrite主要的功能就是实现URL的重写，Ngin</div>
                    </li>
                    <li><a href="/article/1835354700392787968.htm"
                           title="Nginx的使用场景：构建高效、可扩展的Web架构" target="_blank">Nginx的使用场景：构建高效、可扩展的Web架构</a>
                        <span class="text-muted">张某布响丸辣</span>
<a class="tag" taget="_blank" href="/search/nginx/1.htm">nginx</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84/1.htm">架构</a>
                        <div>Nginx，作为当今最流行的Web服务器和反向代理软件之一，凭借其高性能、稳定性和灵活性，在众多Web项目中扮演着核心角色。无论是个人博客、中小型网站，还是大型企业级应用，Nginx都能提供强大的支持。本文将探讨Nginx的几个主要使用场景，帮助读者理解如何在实际项目中充分利用Nginx的优势。1.静态文件服务对于包含大量静态文件（如HTML、CSS、JavaScript、图片等）的网站，Ngin</div>
                    </li>
                    <li><a href="/article/1835342718067372032.htm"
                           title="Python精选200Tips：121-125" target="_blank">Python精选200Tips：121-125</a>
                        <span class="text-muted">AnFany</span>
<a class="tag" taget="_blank" href="/search/Python200%2BTips/1.htm">Python200+Tips</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>
                        <div>Spendyourtimeonself-improvement121Requests-简化的HTTP请求处理发送GET请求发送POST请求发送PUT请求发送DELETE请求会话管理处理超时文件上传122BeautifulSoup-网页解析和抓取解析HTML和XML文档查找单个标签查找多个标签使用CSS选择器查找标签提取文本修改文档内容删除标签处理XML文档123Scrapy-强大的网络爬虫框架示例</div>
                    </li>
                    <li><a href="/article/1835340577596600320.htm"
                           title="前端CSS面试常见题" target="_blank">前端CSS面试常见题</a>
                        <span class="text-muted">剑亦未配妥</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%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/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a>
                        <div>边界塌陷盒模型有两种：W3C盒模型和IE盒模型，区别在于宽度是否包含边框定义：同时给兄弟/父子盒模型设置上下边距，理论上边距值是两者之和，实际上不是注意：浮动和定位不会产生边界塌陷；只有块级元素垂直方向才会产生margin合并margin计算方案margin同为正负：取绝对值大的值一正一负：求和父子元素边界塌陷解决父元素可以通过调整padding处理；设置overflowhidden，触发BFC子</div>
                    </li>
                    <li><a href="/article/1835333268375957504.htm"
                           title="爬虫技术抓取网站数据" target="_blank">爬虫技术抓取网站数据</a>
                        <span class="text-muted">Bearjumpingcandy</span>
<a class="tag" taget="_blank" href="/search/%E7%88%AC%E8%99%AB/1.htm">爬虫</a>
                        <div>爬虫技术是一种自动化获取网站数据的技术，它可以模拟人类浏览器的行为，访问网页并提取所需的信息。以下是爬虫技术抓取网站数据的一般步骤：发起HTTP请求：爬虫首先会发送HTTP请求到目标网站，获取网页的内容。解析HTML：获取到网页内容后，爬虫会使用HTML解析器解析HTML代码，提取出需要的数据。数据提取：通过使用XPath、CSS选择器或正则表达式等工具，爬虫可以从HTML中提取出所需的数据，如文</div>
                    </li>
                    <li><a href="/article/1835296397365178368.htm"
                           title="创建一个完整的购物商城系统是一个复杂的项目，涉及前端（用户界面）、后端（服务器逻辑）、数据库等多个部分。由于篇幅限制，我无法在这里提供一个完整的系统代码，但我可以分别给出一些关键部分的示例代码，涵盖几" target="_blank">创建一个完整的购物商城系统是一个复杂的项目，涉及前端（用户界面）、后端（服务器逻辑）、数据库等多个部分。由于篇幅限制，我无法在这里提供一个完整的系统代码，但我可以分别给出一些关键部分的示例代码，涵盖几</a>
                        <span class="text-muted">uthRaman</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/%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">服务器</a>
                        <div>前端（HTML/CSS/JavaScript）grsyzp.cnHTML页面结构（index.html）html购物商城欢迎来到购物商城JavaScript（Ajax请求商品数据，app.js）javascriptdocument.addEventListener('DOMContentLoaded',function(){fetch('/api/products').then(response=</div>
                    </li>
                    <li><a href="/article/1835258583235784704.htm"
                           title="HTML中"bgcolor"与"background-color"的区别" target="_blank">HTML中"bgcolor"与"background-color"的区别</a>
                        <span class="text-muted">Sardar_</span>
<a class="tag" taget="_blank" href="/search/html/1.htm">html</a>
                        <div>bgcolor只是标签属性，而backgroud更多作为css的样式属性。它们俩大多数情况下效果完全相同。但在标签下效果不同。不支持bgcolor属性，只能用style标签添加CSS样式。作为table的属性而言：HelloWorld!和HelloWorld!效果完全相同。作为body属性而言：效果完全相同。不过个人推荐统一用CSS样式进行控制，把style统一放到.css文件中。backgrou</div>
                    </li>
                    <li><a href="/article/1835247344719851520.htm"
                           title="2019-05-29 vue-router的两种模式的区别" target="_blank">2019-05-29 vue-router的两种模式的区别</a>
                        <span class="text-muted">Kason晨</span>

<div>1、大家都知道vue是一种单页应用,单页应用就是仅在页面初始化的时候加载相应的html/css/js一单页面加载完成,不会因为用户的操作而进行页面的重新加载或者跳转,用javascript动态的变化html的内容优点:良好的交互体验,用户不需要刷新页面,页面显示流畅,良好的前后端工作分离模式,减轻服务器压力,缺点:不利于SEO,初次加载耗时比较多2、hash模式vue-router默认的是hash</div>
                    </li>
                    <li><a href="/article/1835221779212234752.htm"
                           title="清除 Conda 缓存" target="_blank">清除 Conda 缓存</a>
                        <span class="text-muted">Dmatteratall</span>
<a class="tag" taget="_blank" href="/search/conda/1.htm">conda</a><a class="tag" taget="_blank" href="/search/%E7%BC%93%E5%AD%98/1.htm">缓存</a>
                        <div>清除Conda缓存：cssCopycodecondaclean--allcondaclean--all命令将会清除Conda缓存和临时文件，而不会删除已经安装的软件包和环境。它主要用于清理不必要的缓存和临时文件以释放磁盘空间。</div>
                    </li>
                    <li><a href="/article/1835216109297561600.htm"
                           title="electron多标签页模式更像客户端" target="_blank">electron多标签页模式更像客户端</a>
                        <span class="text-muted">diygwcom</span>
<a class="tag" taget="_blank" href="/search/electron/1.htm">electron</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>Electron多标签页模式是指在Electron框架中实现的类似Web浏览器的多标签页功能。Electron是一个使用Web技术（HTML、CSS和JavaScript）来创建跨平台桌面应用程序的框架。在Electron中实现多标签页模式，通常需要借助一些特定的库或组件，如BrowserView或electron-tabs，或者通过自定义实现。实现方式1.使用BrowserViewBrowser</div>
                    </li>
                    <li><a href="/article/1835186351805394944.htm"
                           title="前端HTML+CSS+JS的入门学习" target="_blank">前端HTML+CSS+JS的入门学习</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/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a>
                        <div>一.HTMLHTML（HyperTextMarkupLanguage）即超文本标记语言，是用于创建网页和网页应用程序的标准标记语言。它不是一种编程语言，而是一种标记语言，通过一系列的元素（elements）来告诉浏览器如何显示网页上的内容，如文本、图片、链接、表格、列表等。HTML文档由一系列的标签（tags）组成，这些标签告诉浏览器如何显示内容。标签通常成对出现，例如和，其中是开始标签，表示一个</div>
                    </li>
                    <li><a href="/article/1835151269904347136.htm"
                           title="10/24 每周学习总结5" target="_blank">10/24 每周学习总结5</a>
                        <span class="text-muted">木木ainiks</span>
<a class="tag" taget="_blank" href="/search/1024%E7%A8%8B%E5%BA%8F%E5%91%98%E8%8A%82/1.htm">1024程序员节</a>
                        <div>1RecordingtheMoolympicsS#include#includeusingnamespacestd;typedeflonglongint_1;intn;structnode{int_1begin_b;int_1end_e;}a[300];boolcmp(nodea,nodeb){if(a.end_e==b.end_e)returna.begin_b>b.begin_b;return</div>
                    </li>
                    <li><a href="/article/1835123524155568128.htm"
                           title="HTML5概述" target="_blank">HTML5概述</a>
                        <span class="text-muted">WFIT~SKY</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/html5/1.htm">html5</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>
                        <div>1.HTML概述1.1HTML定义HTML超文本标记语言，其中超文本是链接，标记也叫标签（即带尖括号的文本）。1.2HTML基本骨架HTML基本骨架是网页模板。网页的标题网页的内容html：整个网页head：网页头部，存放给浏览器看的代码，例如CSSbody：网页主体，存放给用户看的代码，例如文字、图片title：网页标题1.3HTML关系父子关系（嵌套）兄弟关系（并列）2.HTML开发环境2.1</div>
                    </li>
                    <li><a href="/article/1835109157406076928.htm"
                           title="CSS中如何实现鼠标悬停效果？" target="_blank">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中，您可以使用:hover伪类来实现鼠标悬停效果。:hover伪类会在用户将鼠标悬停在选择器所匹配的元素上时应用指定的样式。下面是一个简单的例子，展示了如何在鼠标悬停时改变文本颜色和背景颜色：MouseHoverExample.hover-effect{color:black;background-color:white;padding:10px;text-align:center;}.h</div>
                    </li>
                    <li><a href="/article/1835091010678517760.htm"
                           title="js的书写位置和css的书写位置的区别？为什么要这样写？" target="_blank">js的书写位置和css的书写位置的区别？为什么要这样写？</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/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>JavaScript和CSS的书写位置有以下区别：CSS通常写在标签中，或者在外部样式表文件中（）。CSS主要用于控制页面的视觉样式和布局，通常在HTML文件的部分引入，以确保在页面渲染时样式已经加载完毕，从而避免样式闪烁。JavaScript通常写在标签中，或者在外部脚本文件中（）。JavaScript用于添加页面的动态行为和交互。一般建议将JavaScript放在HTML文件的末尾（标签之前）</div>
                    </li>
                    <li><a href="/article/1835048766864977920.htm"
                           title="【H2O2|全栈】关于CSS（3）CSS基础（三）" target="_blank">【H2O2|全栈】关于CSS（3）CSS基础（三）</a>
                        <span class="text-muted">过期的H2O2</span>
<a class="tag" taget="_blank" href="/search/%E3%80%90H2O2%E3%80%91CSS%E5%85%A5%E9%97%A8/1.htm">【H2O2】CSS入门</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基础知识前言准备工作盒模型概念内容的宽高displaypaddingborderborder-widthborder-styleborder-colormargin预告和回顾后话CSS基础知识前言本系列博客将分享层叠样式表（CSS）有关的知识点。作为本系列的第三篇，本博客将分享盒模型以及页面布局有关的知识点。不是专业的科普博主，主打一个分享知识，写的不好，多多包涵（哈哈）。准备工作软件：</div>
                    </li>
                    <li><a href="/article/1835010195202338816.htm"
                           title="css鼠标移上去向上移动,css3鼠标移动图片上移效果" target="_blank">css鼠标移上去向上移动,css3鼠标移动图片上移效果</a>
                        <span class="text-muted">yo xiba</span>
<a class="tag" taget="_blank" href="/search/css%E9%BC%A0%E6%A0%87%E7%A7%BB%E4%B8%8A%E5%8E%BB%E5%90%91%E4%B8%8A%E7%A7%BB%E5%8A%A8/1.htm">css鼠标移上去向上移动</a>
                        <div>css3的功能真是很强大，学无止境，不多说，直接上代码css部分：*{margin:;padding:;}.text-center{text-align:center}.col_cont{width:300px;height:300px;margin:auto}.thumbnail{cursor:pointer;text-decoration:none;display:block;padding:</div>
                    </li>
                    <li><a href="/article/1835002124283506688.htm"
                           title="css3实现鼠标放到图标上自动切换图标" target="_blank">css3实现鼠标放到图标上自动切换图标</a>
                        <span class="text-muted">黄丫丫07</span>
<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/html/1.htm">html</a>
                        <div>作业div{font-family:'icomoon';width:1217px;height:1217px;background:url(images/1.jpg)no-repeat00;transition:all.2s;}div:hover{background:url(images/1.jpg)no-repeat-1200px0;}</div>
                    </li>
                    <li><a href="/article/1835001746208944128.htm"
                           title="CSS实现鼠标移动到购物车显示详情" target="_blank">CSS实现鼠标移动到购物车显示详情</a>
                        <span class="text-muted">AsiaFT.</span>
<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/html/1.htm">html</a>
                        <div>需求：鼠标滑动到购物车时，购物车下面显示购物车详情信息解析：清除所有默认样式：{margin:0;padding:0;}2.CSS3新增属性：box-sizing:border-box;这个属性基本盒子都增加该属性；代码：鼠标划过显示购物车详情/*清除所有默认样式*/*{margin:0;padding:0;}.shoppingcart{/*css3新增属性，控制WIDTH和HEIGHT属性是盒子</div>
                    </li>
                    <li><a href="/article/1834993298238959616.htm"
                           title="基于HTML+JS+CSS+Echarts实现的设备环境监测可视化平台前端整套模板" target="_blank">基于HTML+JS+CSS+Echarts实现的设备环境监测可视化平台前端整套模板</a>
                        <span class="text-muted">abments</span>
<a class="tag" taget="_blank" href="/search/%E5%AE%9E%E7%94%A8%E5%B0%8F%E5%B7%A5%E5%85%B7/1.htm">实用小工具</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/html/1.htm">html</a>
                        <div>效果图基于HTML+JS+CSS+Echarts实现的设备环境监测可视化平台前端整套模板。可用过修改源码快速完成需求。源码结构下载地址</div>
                    </li>
                    <li><a href="/article/1834962276646481920.htm"
                           title="unocss 一直热更新打印[vite] hot updated: /__uno.css" target="_blank">unocss 一直热更新打印[vite] hot updated: /__uno.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/css3/1.htm">css3</a><a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a>
                        <div>控制台持续打印了几千条这条信息，页面逐渐卡死client.ts:450[vite]hotupdated:/__uno.css找出的原因是：依赖出问题了，重新安装unocss，执行命令npmiunocss后修复。但奇怪的是，删除node_modules重新全部安装依赖却不能修复，tmd。还有一种解决方法是切换分支，切去其它分支，再切回来，也不会再打印了。一开始还怀疑了是哪里的unocss类名一直在监</div>
                    </li>
                                <li><a href="/article/17.htm"
                                       title="分享100个最新免费的高匿HTTP代理IP" target="_blank">分享100个最新免费的高匿HTTP代理IP</a>
                                    <span class="text-muted">mcj8089</span>
<a class="tag" taget="_blank" href="/search/%E4%BB%A3%E7%90%86IP/1.htm">代理IP</a><a class="tag" taget="_blank" href="/search/%E4%BB%A3%E7%90%86%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">代理服务器</a><a class="tag" taget="_blank" href="/search/%E5%8C%BF%E5%90%8D%E4%BB%A3%E7%90%86/1.htm">匿名代理</a><a class="tag" taget="_blank" href="/search/%E5%85%8D%E8%B4%B9%E4%BB%A3%E7%90%86IP/1.htm">免费代理IP</a><a class="tag" taget="_blank" href="/search/%E6%9C%80%E6%96%B0%E4%BB%A3%E7%90%86IP/1.htm">最新代理IP</a>
                                    <div>  
推荐两个代理IP网站： 
  
1. 全网代理IP：http://proxy.goubanjia.com/ 
  
2. 敲代码免费IP：http://ip.qiaodm.com/ 
  
  
120.198.243.130:80,中国/广东省
58.251.78.71:8088,中国/广东省
183.207.228.22:83,中国/</div>
                                </li>
                                <li><a href="/article/144.htm"
                                       title="mysql高级特性之数据分区" target="_blank">mysql高级特性之数据分区</a>
                                    <span class="text-muted">annan211</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/1.htm">数据结构</a><a class="tag" taget="_blank" href="/search/mongodb/1.htm">mongodb</a><a class="tag" taget="_blank" href="/search/%E5%88%86%E5%8C%BA/1.htm">分区</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a>
                                    <div>

mysql高级特性
  1 以存储引擎的角度分析，分区表和物理表没有区别。是按照一定的规则将数据分别存储的逻辑设计。器底层是由多个物理字表组成。
  
  2 分区的原理
     分区表由多个相关的底层表实现，这些底层表也是由句柄对象表示，所以我们可以直接访问各个分区。存储引擎管理分区的各个底层
	 表和管理普通表一样(所有底层表都必须使用相同的存储引擎)，分区表的索引只是</div>
                                </li>
                                <li><a href="/article/271.htm"
                                       title="JS采用正则表达式简单获取URL地址栏参数" target="_blank">JS采用正则表达式简单获取URL地址栏参数</a>
                                    <span class="text-muted">chiangfai</span>
<a class="tag" taget="_blank" href="/search/js/1.htm">js</a><a class="tag" taget="_blank" href="/search/%E5%9C%B0%E5%9D%80%E6%A0%8F%E5%8F%82%E6%95%B0%E8%8E%B7%E5%8F%96/1.htm">地址栏参数获取</a>
                                    <div>GetUrlParam:function GetUrlParam(param){
		var reg = new RegExp("(^|&)"+ param +"=([^&]*)(&|$)");
		var r = window.location.search.substr(1).match(reg);
		if(r!=null</div>
                                </li>
                                <li><a href="/article/398.htm"
                                       title="怎样将数据表拷贝到powerdesigner (本地数据库表)" target="_blank">怎样将数据表拷贝到powerdesigner (本地数据库表)</a>
                                    <span class="text-muted">Array_06</span>
<a class="tag" taget="_blank" href="/search/powerDesigner/1.htm">powerDesigner</a>
                                    <div>================================================== 
 
1、打开PowerDesigner12，在菜单中按照如下方式进行操作 
file->Reverse Engineer->DataBase 
点击后，弹出 New Physical Data Model 的对话框 
2、在General选项卡中 
Model name:模板名字，自</div>
                                </li>
                                <li><a href="/article/525.htm"
                                       title="logbackのhelloworld" target="_blank">logbackのhelloworld</a>
                                    <span class="text-muted">飞翔的马甲</span>
<a class="tag" taget="_blank" href="/search/%E6%97%A5%E5%BF%97/1.htm">日志</a><a class="tag" taget="_blank" href="/search/logback/1.htm">logback</a>
                                    <div>一、概述 
 
1.日志是啥？ 
当我是个逗比的时候我是这么理解的：log.debug()代替了system.out.print(); 
当我项目工作时，以为是一堆得.log文件。 
这两天项目发布新版本，比较轻松，决定好好地研究下日志以及logback。 
传送门1：日志的作用与方法： 
http://www.infoq.com/cn/articles/why-and-how-log 
上面的作</div>
                                </li>
                                <li><a href="/article/652.htm"
                                       title="新浪微博爬虫模拟登陆" target="_blank">新浪微博爬虫模拟登陆</a>
                                    <span class="text-muted">随意而生</span>
<a class="tag" taget="_blank" href="/search/%E6%96%B0%E6%B5%AA%E5%BE%AE%E5%8D%9A/1.htm">新浪微博</a>
                                    <div>转载自：http://hi.baidu.com/erliang20088/item/251db4b040b8ce58ba0e1235 
  
  
近来由于毕设需要，重新修改了新浪微博爬虫废了不少劲，希望下边的总结能够帮助后来的同学们。 
     现行版的模拟登陆与以前相比，最大的改动在于cookie获取时候的模拟url的请求</div>
                                </li>
                                <li><a href="/article/779.htm"
                                       title="synchronized" target="_blank">synchronized</a>
                                    <span class="text-muted">香水浓</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/thread/1.htm">thread</a>
                                    <div>    Java语言的关键字，可用来给对象和方法或者代码块加锁，当它锁定一个方法或者一个代码块的时候，同一时刻最多只有一个线程执行这段代码。当两个并发线程访问同一个对象object中的这个加锁同步代码块时，一个时间内只能有一个线程得到执行。另一个线程必须等待当前线程执行完这个代码块以后才能执行该代码块。然而，当一个线程访问object的一个加锁代码块时，另一个线程仍然</div>
                                </li>
                                <li><a href="/article/906.htm"
                                       title="maven 简单实用教程" target="_blank">maven 简单实用教程</a>
                                    <span class="text-muted">AdyZhang</span>
<a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a>
                                    <div>1. Maven介绍  1.1. 简介 java编写的用于构建系统的自动化工具。目前版本是2.0.9，注意maven2和maven1有很大区别，阅读第三方文档时需要区分版本。 1.2. Maven资源 见官方网站；The 5 minute test，官方简易入门文档；Getting Started Tutorial，官方入门文档；Build Coo</div>
                                </li>
                                <li><a href="/article/1033.htm"
                                       title="Android 通过 intent传值获得null" target="_blank">Android 通过 intent传值获得null</a>
                                    <span class="text-muted">aijuans</span>
<a class="tag" taget="_blank" href="/search/android/1.htm">android</a>
                                    <div>我在通过intent 获得传递兑现过的时候报错，空指针,我是getMap方法进行传值，代码如下        1   2   3   4   5   6   7   8   9      
public 
void 
getMap(View view){       
         
Intent i =</div>
                                </li>
                                <li><a href="/article/1160.htm"
                                       title="apache 做代理 报如下错误：The proxy server received an invalid response from an upstream" target="_blank">apache 做代理 报如下错误：The proxy server received an invalid response from an upstream</a>
                                    <span class="text-muted">baalwolf</span>
<a class="tag" taget="_blank" href="/search/response/1.htm">response</a>
                                    <div>网站配置是apache＋tomcat,tomcat没有报错，apache报错是： 
The proxy server received an invalid response from an upstream server. The proxy server could not handle the request GET /. Reason: Error reading fr</div>
                                </li>
                                <li><a href="/article/1287.htm"
                                       title="Tomcat6 内存和线程配置" target="_blank">Tomcat6 内存和线程配置</a>
                                    <span class="text-muted">BigBird2012</span>
<a class="tag" taget="_blank" href="/search/tomcat6/1.htm">tomcat6</a>
                                    <div>1、修改启动时内存参数、并指定JVM时区 （在windows server 2008 下时间少了8个小时） 
在Tomcat上运行j2ee项目代码时，经常会出现内存溢出的情况，解决办法是在系统参数中增加系统参数：  
window下， 在catalina.bat最前面 
  set JAVA_OPTS=-XX:PermSize=64M -XX:MaxPermSize=128m -Xms5</div>
                                </li>
                                <li><a href="/article/1414.htm"
                                       title="Karam与TDD" target="_blank">Karam与TDD</a>
                                    <span class="text-muted">bijian1013</span>
<a class="tag" taget="_blank" href="/search/Karam/1.htm">Karam</a><a class="tag" taget="_blank" href="/search/TDD/1.htm">TDD</a>
                                    <div>一.TDD 
        测试驱动开发（Test-Driven Development,TDD）是一种敏捷（AGILE）开发方法论，它把开发流程倒转了过来，在进行代码实现之前，首先保证编写测试用例，从而用测试来驱动开发（而不是把测试作为一项验证工具来使用）。 
        TDD的原则很简单： 
a.只有当某个</div>
                                </li>
                                <li><a href="/article/1541.htm"
                                       title="[Zookeeper学习笔记之七]Zookeeper源代码分析之Zookeeper.States" target="_blank">[Zookeeper学习笔记之七]Zookeeper源代码分析之Zookeeper.States</a>
                                    <span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/zookeeper/1.htm">zookeeper</a>
                                    <div>    public enum States {
        CONNECTING, //Zookeeper服务器不可用，客户端处于尝试链接状态
        ASSOCIATING, //？？？
        CONNECTED, //链接建立，可以与Zookeeper服务器正常通信
        CONNECTEDREADONLY, //处于只读状态的链接状态，只读模式可以在</div>
                                </li>
                                <li><a href="/article/1668.htm"
                                       title="【Scala十四】Scala核心八：闭包" target="_blank">【Scala十四】Scala核心八：闭包</a>
                                    <span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/scala/1.htm">scala</a>
                                    <div>Free variable A free variable of an expression is a variable that’s used inside the expression but not defined inside the expression. For instance, in the function literal expression (x: Int) => (x</div>
                                </li>
                                <li><a href="/article/1795.htm"
                                       title="android发送json并解析返回json" target="_blank">android发送json并解析返回json</a>
                                    <span class="text-muted">ronin47</span>
<a class="tag" taget="_blank" href="/search/android/1.htm">android</a>
                                    <div>package com.http.test; 
 
 
import org.apache.http.HttpResponse; 
import org.apache.http.HttpStatus; 
import org.apache.http.client.HttpClient; 
import org.apache.http.client.methods.HttpGet; 
import </div>
                                </li>
                                <li><a href="/article/1922.htm"
                                       title="一份IT实习生的总结" target="_blank">一份IT实习生的总结</a>
                                    <span class="text-muted">brotherlamp</span>
<a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/php%E8%B5%84%E6%96%99/1.htm">php资料</a><a class="tag" taget="_blank" href="/search/php%E6%95%99%E7%A8%8B/1.htm">php教程</a><a class="tag" taget="_blank" href="/search/php%E5%9F%B9%E8%AE%AD/1.htm">php培训</a><a class="tag" taget="_blank" href="/search/php%E8%A7%86%E9%A2%91/1.htm">php视频</a>
                                    <div>今天突然发现在不知不觉中自己已经实习了 3 个月了，现在可能不算是真正意义上的实习吧，因为现在自己才大三，在这边撸代码的同时还要考虑到学校的功课跟期末考试。让我震惊的是，我完全想不到在这 3 个月里我到底学到了什么，这是一件多么悲催的事情啊。同时我对我应该 get 到什么新技能也很迷茫。所以今晚还是总结下把，让自己在接下来的实习生活有更加明确的方向。最后感谢工作室给我们几个人这个机会让我们提前出来</div>
                                </li>
                                <li><a href="/article/2049.htm"
                                       title="据说是2012年10月人人网校招的一道笔试题-给出一个重物重量为X,另外提供的小砝码重量分别为1，3，9。。。3^N。 将重物放到天平左侧，问在两边如何添加砝码" target="_blank">据说是2012年10月人人网校招的一道笔试题-给出一个重物重量为X,另外提供的小砝码重量分别为1，3，9。。。3^N。 将重物放到天平左侧，问在两边如何添加砝码</a>
                                    <span class="text-muted">bylijinnan</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a>
                                    <div>
public class ScalesBalance {

/**
	 * 题目：
	 * 给出一个重物重量为X,另外提供的小砝码重量分别为1，3，9。。。3^N。 （假设N无限大，但一种重量的砝码只有一个）
	 * 将重物放到天平左侧，问在两边如何添加砝码使两边平衡
	 * 
	 * 分析：
	 * 三进制
	 * 我们约定括号表示里面的数是三进制，例如 47=(1202</div>
                                </li>
                                <li><a href="/article/2176.htm"
                                       title="dom4j最常用最简单的方法" target="_blank">dom4j最常用最简单的方法</a>
                                    <span class="text-muted">chiangfai</span>
<a class="tag" taget="_blank" href="/search/dom4j/1.htm">dom4j</a>
                                    <div>要使用dom4j读写XML文档,需要先下载dom4j包,dom4j官方网站在 http://www.dom4j.org/目前最新dom4j包下载地址:http://nchc.dl.sourceforge.net/sourceforge/dom4j/dom4j-1.6.1.zip 
解开后有两个包,仅操作XML文档的话把dom4j-1.6.1.jar加入工程就可以了,如果需要使用XPath的话还需要</div>
                                </li>
                                <li><a href="/article/2303.htm"
                                       title="简单HBase笔记" target="_blank">简单HBase笔记</a>
                                    <span class="text-muted">chenchao051</span>
<a class="tag" taget="_blank" href="/search/hbase/1.htm">hbase</a>
                                    <div> 一、Client-side write buffer 客户端缓存请求   描述：可以缓存客户端的请求，以此来减少RPC的次数，但是缓存只是被存在一个ArrayList中，所以多线程访问时不安全的。   可以使用getWriteBuffer()方法来取得客户端缓存中的数据。 默认关闭。      二、Scan的Caching   描述： next( )方法请求一行就要使用一次RPC,即使</div>
                                </li>
                                <li><a href="/article/2430.htm"
                                       title="mysqldump导出时出现when doing LOCK TABLES" target="_blank">mysqldump导出时出现when doing LOCK TABLES</a>
                                    <span class="text-muted">daizj</span>
<a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/mysqdump/1.htm">mysqdump</a><a class="tag" taget="_blank" href="/search/%E5%AF%BC%E6%95%B0%E6%8D%AE/1.htm">导数据</a>
                                    <div>　　执行　mysqldump -uxxx -pxxx -hxxx -Pxxxx database tablename > tablename.sql　 
导出表时，会报 
 
mysqldump: Got error: 1044: Access denied for user 'xxx'@'xxx' to database 'xxx' when doing LOCK TABLES 
 
解决</div>
                                </li>
                                <li><a href="/article/2557.htm"
                                       title="CSS渲染原理" target="_blank">CSS渲染原理</a>
                                    <span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a>
                                    <div>   从事Web前端开发的人都与CSS打交道很多，有的人也许不知道css是怎么去工作的，写出来的css浏览器是怎么样去解析的呢？当这个成为我们提高css水平的一个瓶颈时，是否应该多了解一下呢？   
  
       一、浏览器的发展与CSS      
  
   </div>
                                </li>
                                <li><a href="/article/2684.htm"
                                       title="《阿甘正传》台词" target="_blank">《阿甘正传》台词</a>
                                    <span class="text-muted">dcj3sjt126com</span>

<div>Part Ⅰ: 
《阿甘正传》Forrest Gump经典中英文对白 
Forrest: Hello! My names Forrest. Forrest Gump. You wanna Chocolate? I could eat about a million and a half othese. My momma always said life was like a box ochocol</div>
                                </li>
                                <li><a href="/article/2811.htm"
                                       title="Java处理JSON" target="_blank">Java处理JSON</a>
                                    <span class="text-muted">dyy_gusi</span>
<a class="tag" taget="_blank" href="/search/json/1.htm">json</a>
                                    <div>Json在数据传输中很好用，原因是JSON 比 XML 更小、更快，更易解析。 
在Java程序中，如何使用处理JSON，现在有很多工具可以处理，比较流行常用的是google的gson和alibaba的fastjson，具体使用如下： 
1、读取json然后处理 
class ReadJSON
{
    public static void main(String[] args)
    </div>
                                </li>
                                <li><a href="/article/2938.htm"
                                       title="win7下nginx和php的配置" target="_blank">win7下nginx和php的配置</a>
                                    <span class="text-muted">geeksun</span>
<a class="tag" taget="_blank" href="/search/nginx/1.htm">nginx</a>
                                    <div>1.  安装包准备 
nginx :  从nginx.org下载nginx-1.8.0.zip 
php： 从php.net下载php-5.6.10-Win32-VC11-x64.zip， php是免安装文件。 
RunHiddenConsole: 用于隐藏命令行窗口 
  
2. 配置 
# java用8080端口做应用服务器，nginx反向代理到这个端口即可 
p</div>
                                </li>
                                <li><a href="/article/3065.htm"
                                       title="基于2.8版本redis配置文件中文解释" target="_blank">基于2.8版本redis配置文件中文解释</a>
                                    <span class="text-muted">hongtoushizi</span>
<a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a>
                                    <div>转载自： http://wangwei007.blog.51cto.com/68019/1548167 
       在Redis中直接启动redis-server服务时, 采用的是默认的配置文件。采用redis-server   xxx.conf 这样的方式可以按照指定的配置文件来运行Redis服务。下面是Redis2.8.9的配置文</div>
                                </li>
                                <li><a href="/article/3192.htm"
                                       title="第五章 常用Lua开发库3-模板渲染" target="_blank">第五章 常用Lua开发库3-模板渲染</a>
                                    <span class="text-muted">jinnianshilongnian</span>
<a class="tag" taget="_blank" href="/search/nginx/1.htm">nginx</a><a class="tag" taget="_blank" href="/search/lua/1.htm">lua</a>
                                    <div>动态web网页开发是Web开发中一个常见的场景，比如像京东商品详情页，其页面逻辑是非常复杂的，需要使用模板技术来实现。而Lua中也有许多模板引擎，如目前我在使用的lua-resty-template，可以渲染很复杂的页面，借助LuaJIT其性能也是可以接受的。 
  
如果学习过JavaEE中的servlet和JSP的话，应该知道JSP模板最终会被翻译成Servlet来执行；而lua-r</div>
                                </li>
                                <li><a href="/article/3319.htm"
                                       title="JZSearch大数据搜索引擎" target="_blank">JZSearch大数据搜索引擎</a>
                                    <span class="text-muted">颠覆者</span>
<a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a>
                                    <div>系统简介： 
 
 大数据的特点有四个层面：第一，数据体量巨大。从TB级别，跃升到PB级别；第二，数据类型繁多。网络日志、视频、图片、地理位置信息等等。第三，价值密度低。以视频为例，连续不间断监控过程中，可能有用的数据仅仅有一两秒。第四，处理速度快。最后这一点也是和传统的数据挖掘技术有着本质的不同。业界将其归纳为4个“V”——Volume，Variety，Value，Velocity。大数据搜索引</div>
                                </li>
                                <li><a href="/article/3446.htm"
                                       title="10招让你成为杰出的Java程序员" target="_blank">10招让你成为杰出的Java程序员</a>
                                    <span class="text-muted">pda158</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B/1.htm">编程</a><a class="tag" taget="_blank" href="/search/%E6%A1%86%E6%9E%B6/1.htm">框架</a>
                                    <div>如果你是一个热衷于技术的  
Java 程序员， 那么下面的 10 个要点可以让你在众多 Java 开发人员中脱颖而出。   　　 
1. 拥有扎实的基础和深刻理解 OO 原则   　　对于 Java 程序员，深刻理解 Object Oriented Programming（面向对象编程）这一概念是必须的。没有 OOPS 的坚实基础，就领会不了像 Java 这些面向对象编程语言</div>
                                </li>
                                <li><a href="/article/3573.htm"
                                       title="tomcat之oracle连接池配置" target="_blank">tomcat之oracle连接池配置</a>
                                    <span class="text-muted">小网客</span>
<a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a>
                                    <div>tomcat版本7.0 
配置oracle连接池方式： 
修改tomcat的server.xml配置文件： 
 <GlobalNamingResources>
 
			  <Resource name="utermdatasource" auth="Container"  
 type="javax.sql.DataSou</div>
                                </li>
                                <li><a href="/article/3700.htm"
                                       title="Oracle 分页算法汇总" target="_blank">Oracle 分页算法汇总</a>
                                    <span class="text-muted">vipbooks</span>
<a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/.net/1.htm">.net</a>
                                    <div>    这是我找到的一些关于Oracle分页的算法，大家那里还有没有其他好的算法没？我们大家一起分享一下！

-- Oracle 分页算法一
select * from (
       select page.*,rownum rn from (select * from help) page 
       -- 20 = (currentPag</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.

        </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>