weixin_33947521
weixin_33947521

图片圆角并居中显示解决方案

1、图片圆角显示

例如（非常简单）：

HTML：

<img src="mao.png" />

CSS：

img{
    border-radius: 10px;
}

如果图片只为圆角，这种方式确实没问题，但如果还要加上居中的效果，这种方式就有问题，下面会说明。

2、图片居中显示（铺满父容器且不变形）

效果图如下：

PS：为了实现上图居中的效果，单靠CSS是不行的，还需要JS处理。

例如：

HTML：

<div class="rd-box" style="width:200px;height:200px;overflow:hidden;">
    <img src="mao.png" onload="centerThisImg(this, 200, 200)"/>
div>

CSS：

.rd-box{
    position: relative;
    display: inline-block;
    border-radius: 10px;
}
.rd-box img{
    display: block;
    border-radius: 10px;   
}

JS：

//图片自适应填充，并居中显示。
function centerThisImg(el, maxWidth, maxHeight){
    var $img = $(el),
        img = $img[0];
    var imgHeight = img.naturalHeight,
        imgWidth = img.naturalWidth,
        finalWidth,
        finalHeight,
        tsffix = '';
    var rm = maxWidth / maxHeight,
        r = imgWidth / imgHeight;

    if(r < rm){
        finalWidth = maxWidth;
        finalHeight = maxWidth / r;
        tsffix = 'translateY(-' + (finalHeight - maxHeight) / 2 + 'px)';
    } else {
        finalHeight = maxHeight;
        finalWidth = maxHeight * r;
        tsffix = 'translateX(-' + (finalWidth - maxWidth) / 2 + 'px)';
    }
    $img.css({width: finalWidth, height: finalHeight, transform: tsffix});
}

PS：图片的长宽是不定的，为了让图片不变形的铺满父容器，需要重新计算图片长宽，并计算居中需要位移的距离。

从这一点就可以看到我说的问题，在CSS中我是加上圆角的样式，但实际上却没有圆角效果。

这是因为当我们把图片居中（不变形）时，我们看到的现在居中的四角，其实是图片中间部位，真正图片的四角早在不可见的地方。

所以，想让居中的图片再有圆角效果，得另外想办法。

3、遮挡法模拟出圆角

我们可以用四个内凹三角形，遮挡在图片四角上（居中后的），让人误以为是图片圆角了。

例如（结合居中的完整代码）：

DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>正方形居中显示并且圆角title>
    <style>
        img{
            height: 200px;
        }
        label{
            display: block;
        }
        .rd-box2{
            position: relative;
            display: inline-block;
        }
        .rd-box2 img{
            display: block;
        }
        .rd-box2 .left-top,
        .rd-box2 .right-top,
        .rd-box2 .left-bottom,
        .rd-box2 .right-bottom{
            position: absolute;
            width: 10px;
            height: 10px;
            z-index: 1;
        }
        .rd-box2 .left-top{
            top: 0;
            left: 0;
            background: radial-gradient(20px at right bottom,transparent 50%,#F4F4F4 50%);
        }
        .rd-box2 .right-top{
            top: 0;
            right: 0;
            background: radial-gradient(20px at left bottom,transparent 50%,#F4F4F4 50%);
        }
        .rd-box2 .left-bottom{
            bottom: 0;
            left: 0;
            background: radial-gradient(20px at right top,transparent 50%,#F4F4F4 50%);
        }
        .rd-box2 .right-bottom{
            bottom: 0;
            right: 0;
            background: radial-gradient(20px at left top,transparent 50%,#F4F4F4 50%);
        }
    style>
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js">script>
    <script>
        //图片自适应填充，并居中显示。
        function centerThisImg(el, maxWidth, maxHeight){
            var $img = $(el),
                img = $img[0];
            var imgHeight = img.naturalHeight,
                imgWidth = img.naturalWidth,
                finalWidth,
                finalHeight,
                tsffix = '';
            var rm = maxWidth / maxHeight,
                r = imgWidth / imgHeight;

            if(r < rm){
                finalWidth = maxWidth;
                finalHeight = maxWidth / r;
                tsffix = 'translateY(-' + (finalHeight - maxHeight) / 2 + 'px)';
            } else {
                finalHeight = maxHeight;
                finalWidth = maxHeight * r;
                tsffix = 'translateX(-' + (finalWidth - maxWidth) / 2 + 'px)';
            }
            $img.css({width: finalWidth, height: finalHeight, transform: tsffix});
        }
    script>
head>
<body>
    <label>正方形居中显示并且圆角：label>
    <div class="rd-box2" style="width:200px;height:200px;overflow:hidden;">
        <i class="left-top">i>
        <i class="right-top">i>
        <i class="left-bottom">i>
        <i class="right-bottom">i>
        <img src="mao.png" onload="centerThisImg(this, 200, 200)"/>
    div>
body>
html>
View Code

效果图如下：

总结：

其实，如果图片能够继承父元素的圆角效果，那么就不需要这么麻烦，但是现实是图片元素四个角会超出父元素（设了圆角）。

我查阅了资料，有人说这种行为是浏览器默认特性，就是这样效果（https://stackoverflow.com/questions/8582176/should-border-radius-clip-the-content）。

我实际的测试也是这样，不过，就不深究了。

 

本文为原创文章，转载请保留原出处，方便溯源，如有错误地方，谢谢指正。

本文地址 ：http://www.cnblogs.com/lovesong/p/10015829.html

你可能感兴趣的:(图片圆角并居中显示解决方案)

  • Nature：你的大脑衰老速度受这64个基因影响 量子位
    你的大脑衰老速度，原来受这64个基因影响！事情是这样的。根据Nature最新报道，科学家们通过利用AI模型分析大量脑部扫描和遗传数据，确定了64个影响大脑衰老速度的基因，并指出了13种潜在的抗衰老药物。相关研究发表在最新一期Science子刊《ScienceAdvances》上。按照Nature的评价，这是尝试确定影响器官衰退遗传因素这一研究领域里：迄今为止规模最大的一次尝试都柏林圣三一学院的神经
  • 开源应用驱动企业新质生产力：Websoft9以EPP+AI+知识库助您领跑未来！ 深度学习
    开源应用驱动企业新质生产力：Websoft9以EPP+AI+知识库助您领跑未来在数字化转型加速的今天，企业新质生产力的核心已从传统资源投入转向技术驱动的效率革命。开源应用凭借其灵活性、成本优势和技术创新力，成为企业实现这一目标的关键引擎。作为开源技术与行业场景化落地的领航者，Websoft9通过企业应用平台（EPP）、AI智能引擎与知识库系统三位一体的解决方案，助力企业快速构建新一代生产力工具，实
  • 如何提高测试用例覆盖率？ 测试老哥 测试用例测试工具软件测试自动化测试python测试覆盖率职场和发展
    点击文末小卡片，免费获取软件测试全套资料，资料在手，涨薪更快我们将讨论测试覆盖率的相关问题，以及它如何帮助提高软件质量的。测试覆盖率概述测试覆盖率被定义为一种测试技术指标，它表明我们的测试用例是否真正完全覆盖了应用程序代码中的各种可能以及在运行这些测试用例时执行了多少代码。如果有10个需求并创建了100个场景测试用例，并且执行了90个测试用例，则测试覆盖率为90％。现在，基于这个指标，测试人员可以
  • 使用SetupTools 管理你的项目打包工作 魔王阿卡纳兹 开源项目观察Python学习札记pythonsetuptools代码分发
    Setuptools是一个用于Python的包管理工具，主要用于构建、打包和分发Python软件包。它是distutils的增强版，提供了更多的功能和灵活性，是Python包管理的核心模块之一。功能与特点依赖管理：Setuptools提供了强大的依赖管理功能，可以自动解析和安装软件包所需的依赖项。自动生成入口点：它能够自动发现并生成命令行脚本的入口点，例如将Python脚本转换为可执行文件。模块发
  • 优化 Java 数据结构选择与使用，提升程序性能与可维护性 草药味儿の岁月 java数据结构开发语言
    引言在软件开发中，数据结构的选择是影响程序性能、内存使用以及代码可维护性的关键因素之一。Java作为一门广泛使用的编程语言，提供了丰富的内置数据结构，如数组、链表、栈、队列、树、图以及集合框架中的各种接口实现（如List,Set,Map等）。然而，面对不同的应用场景，如何合理地选择和优化数据结构，成为了一个值得深入探讨的话题。本文将介绍几种常见的Java数据结构，并探讨如何根据实际需求进行优化选择
  • 网络安全技术好就业吗? 黑客呀 计算机网络安全网络工程师网络web安全安全
    准确的告诉你，网络安全好就业!从目前情况来讲，网络安全是比较好就业的，人才缺口巨大。据了解，每年网络安全技术人才的缺口100-150万，网络安全形势严峻，需要有更多网络安全人才。据《网络信息安全产业人才发展报告》显示，目前我国网络安全专业人才缺口超过140万，2022上半年，网络安全产业人才需求总量较去年增长39.87%，正因如此网络安全薪资待遇也相对于较高。网络安全未来发展如何?1、网络安全就业
  • 如何在docker私有仓库中删除镜像 申朝先生 docker容器linux
    以registry镜像为例1.拉取镜像docker pullregistry2.启动该容器查看打包后的容器并启动(我这个是已经弄好的)dockerps-adockerstartregistry3.镜像上传至私有仓库（1）标记镜像为私有仓库的镜像dockertag镜像名ip:端口号(一般是5000)/镜像名:版本(tag)dockertag镜像名ip:端口号(一般是5000)/镜像名:版本(tag)
  • Python eval 函数 Python 学习者 Python
    Pythoneval函数学习与总结。基本用法简介eval()函数用来执行一个字符串表达式，并返回表达式的值。eval(expression[,globals[,locals]])expression：表达式。globals：变量作用域，全局命名空间，如果被提供，则必须是一个字典对象。locals：变量作用域，局部命名空间，如果被提供，可以是任何映射对象。>>>x=7>>>eval('3*x')21
  • C语言刷题第三章(中) 乞丐1469 C语言刷题c语言算法
    二.题目4.成绩的输入输出(1)题目描述：输入三科成绩，然后把三科成绩输出，成绩为整数形式。(2)输入描述：一行，三科成绩，用空格分割，范围(0~100)。(3)输出描述：一行，把三科成绩显示出来，输出格式见样例。(4)示例：输入：608090输出：score1=60,score2=80,score3=90(5)代码样例：方法一：#includeintmain(){doubles1,s2,s3;s
  • 设计模式系列开篇：解锁软件设计的智慧密码 Ti笔记 设计模式java开发语言
    在软件开发的世界里，我们常常会遇到这样一些问题：如何让代码更加优雅、可维护？如何在需求不断变化的情况下快速响应？如何让团队协作更加高效？这些问题看似复杂，但其实早已有人为我们提供了答案，那就是——设计模式。一、设计模式是什么？设计模式（DesignPattern）是软件设计中的一种通用解决方案，它是一种经过验证、可复用的代码设计模板，用于解决特定场景下的常见问题。设计模式并不是一段具体的代码，而是
  • Three.js 阴影 (Shadow) 知识点整理 泫凝 javascriptthree.jsnpm前端
    阴影主要由castShadow和receiveShadow控制，并通过不同类型的光源(DirectionalLight、SpotLight、PointLight)生成。我们将系统地整理与阴影相关的知识点。1️⃣基础概念castShadow：物体是否投射阴影。receiveShadow️：物体是否接收阴影。renderer.shadowMap.enabled=true✅：全局开启阴影渲染。rende
  • 007Java集合011遍历集合元素并修改 执笔未来 Java学习笔记java
    注意：本文基于JDK1.8进行记录。1遍历Collection对List和Set的遍历，有四种方式，下面以ArrayList为例进行说明。1.1普通for循环使用普通for循环的遍历方式效率最高，尽量将循环无关的代码放置在集合外执行。代码如下：for(inti=0;ilist=newArrayList();  list.add(1);  list.add(2);  list.add(2);  li
  • 基于AI编程，产品全流程变革的具体案例 xinxiyinhe AI编程人工智能
    一、制造业智能化生产案例1.长安汽车南京工厂通过部署AI驱动的柔性制造系统，工厂可在5分钟内切换生产不同型号的电动汽车底盘，并利用数字孪生技术实时模拟生产变量，将设备停机时间大幅缩短。AI算法结合历史订单数据、供应链状态等参数，自主生成最优生产计划，实现生产效率与灵活性的双重提升。2.隆基乐叶光伏制造首创基于图像特征的实时AI精准追溯技术，每18秒完成12个电池串异常识别，解决传统追溯准确率低的问
  • java set遍历删除元素_Java 集合（List、Set）遍历、判断、删除元素时的小陷阱 疯狂的Java说书酱 javaset遍历删除元素
    开发中，常有场景：遍历集合，依次判断是否符合条件，如符合条件则删除当前元素。不知不觉中，有些陷阱，不知你有没有犯。1.一、漏网之鱼-for循环递增下标方式遍历集合，并删除元素如果你用for循环递增下标方式遍历集合，在遍历过程中删除元素，你可能会遗漏了某些元素。说那么说可能也说不清楚，看以下示例：importjava.util.ArrayList;importjava.util.List;publi
  • Linux中断机制详解：从原理到实践 AllenBright #Linuxlinux运维服务器
    想象一下医院的急诊科：当有危重病人到达时，护士会立即按下紧急呼叫按钮，打断医生当前的常规工作，优先处理最紧急的情况。这种中断响应机制正是计算机系统中中断（Interrupt）的核心思想。在Linux内核中，中断是硬件与软件交互的核心机制，直接关系到系统的响应速度、吞吐量和稳定性。本文将深入剖析Linux中断的工作原理，并演示如何在实际操作中管理和优化中断。1.中断的本质与分类1.1什么是中断？中断
  • 鸿蒙特效教程03-水波纹动画效果实现教程 苏杰豪 鸿蒙特效教程HarmonyOSharmonyos华为
    鸿蒙特效教程03-水波纹动画效果实现教程本教程适合HarmonyOS初学者，通过简单到复杂的步骤，一步步实现漂亮的水波纹动画效果。最终效果预览我们将实现以下功能：点击屏幕任意位置，在点击处生成一个水波纹触摸并滑动屏幕，波纹会实时跟随手指位置生成波纹从小到大扩散，同时逐渐消失波纹颜色随机变化，增加视觉多样性一、创建基础布局首先，我们需要创建一个基础页面布局。这个布局包含一个占满屏幕的区域，用于展示水
  • Python数据可视化 Pyecharts 制作 Grid 组合组件 Mr数据杨 Python数据可视化数据可视化python数据分析pyecharts组合组件
    在数据可视化中，常常需要将多个不同类型的图表放置在同一个页面中，以便综合展示多个维度的数据。pyecharts库中的Grid类正是为此设计的，它允许用户将多个图表组合在一起，实现复杂的数据展示需求。通过灵活的布局配置，Grid类不仅能够帮助用户创建具有多图组合的复杂布局，还能通过精细的网格和坐标轴设置，提升图表的整体视觉效果和交互体验。本文将介绍如何使用Grid类创建并行多图，并通过多种图表组合的
  • Flutter 图标自定义：从基础组件到个性化定制 阿贾克斯的黎明 javascript开发语言ecmascript
    目录Flutter图标自定义：从基础组件到个性化定制Flutter自带图标组件自定义图标使用字体图标使用图片作为图标总结在Flutter开发中，图标是界面设计不可或缺的元素，它能直观地传达信息，提升用户体验。Flutter不仅提供了丰富的自带图标组件，还支持自定义图标，让开发者能够打造独一无二的界面风格。本文将深入探讨Flutter图标相关知识，并结合代码示例，助你轻松掌握图标使用与定制技巧。Fl
  • STM32入门教程——CAN驱动经验文档 单片机的码农 STM32入门教程stm32单片机嵌入式硬件
    ##1.引言-简述STM32F407微控制器及其在工业和汽车应用中的CAN通讯重要性。-阐明文档的目标，即分享STM32F407CAN驱动的开发经验和最佳实践。##2.STM32F407CAN硬件特性-详细介绍STM32F407的CAN硬件特性，包括消息RAM、工作模式、消息过滤等。-讨论STM32F407的CAN外设时钟配置和中断管理。##3.开发环境搭建-推荐并指导安装必要的软件工具，如STM
  • JavaScript性能优化实战：从8s到0.8s的极致提升 小诸葛IT课堂 前端
    ‌摘要‌：页面卡顿、内存泄漏、CPU爆满？本文通过‌6个真实场景‌+‌可运行代码示例‌，手把手教你掌握JS性能优化核心技术！涵盖‌防抖节流、虚拟滚动、WebWorkers、内存泄漏排查‌等高频痛点解决方案，最后提供Chrome性能分析工具实战指南，助你打造丝滑的Web应用！一、性能优化核心指标（先量化再优化）1.1关键性能指标‌FPS‌：帧率≥60为合格（开发者工具Performance面板）‌内
  • MMD模型及动作一键完美导入UE5-Blender方案（三） tangfuling1991 UE4移动端AndroidiOS入门ue5blenderMMD模型动作
    1、下载并安装blender_mmd_tools插件1、下载并安装Blender，Blender，下载Blender3.6，下载太新的版本可能会跟blender_mmd_tools不匹配2、github下载blender_mmd_tools：https://github.com/UuuNyaa/blender_mmd_tools/3、Edit->Preference->Addons->Instal
  • OpenCV 深度学习模块 cv2.dnn 与其他深度学习框架的优缺点对比及适用场景 白.夜 深度学习opencv
    OpenCV提供了一个深度学习模块cv2.dnn，让开发者能够在计算机视觉项目中轻松加载和推理深度学习模型。相比于TensorFlow、PyTorch等其他深度学习框架，cv2.dnn有其独特的优点与缺点，适用于不同的应用场景。在这篇文章中，我们将详细分析cv2.dnn的优缺点，并讨论它的适用场景。一、cv2.dnn的优点1.简单易用cv2.dnn提供了一个相对简单且易于使用的接口，适合已经在使用
  • TDengine 使用教程：从入门到实践 遇见伯灵说 tdengine大数据时序数据库
    TDengine是一款专为物联网（IoT）和大数据实时分析设计的时序数据库。它能够高效地处理海量的时序数据，并提供低延迟、高吞吐量的性能表现。在本文中，我们将带领大家从TDengine的安装、基本操作到一些高级功能，帮助你快速上手。1.TDengine简介TDengine是一个高效的时序数据存储解决方案，支持高并发写入和快速的实时分析。它适用于各种物联网应用场景，如传感器数据监控、日志数据处理等。
  • 浩方erp工厂制造业数字化的核心-erp生产管理系统- haofang_software 数据库大数据个人开发人工智能sass
    工厂制造业数字化的核心在于通过先进的企业ERP（EnterpriseResourcePlanning）生产管理系统实现全面的资源优化和流程自动化。浩方动力科技-haofangsoftware的工厂ERP系统，制造业行业管理erp系统，生产管理系统，能帮助各行业工厂、制造业实现采购、销售、生产、物控、库存、客户、供应商、财务、人力资源、设备等全方位的数字化管理，提高工厂生产效率，降低成本，并配合ME
  • iOS OC使用正则表达式去除特殊符号并加粗文本，适用于接入AI大模型的流模式数据的文字处理 MrZWCui iOSiosxcodeobjective-c正则表达式学习
    1、编写逻辑使用分类(Category)的方法拓展NSString，本文使用NSString(Markdown)，NSString的分类来编写一个通用方法，使用正则表达式匹配字符串实现去除特殊字符，并自定义文字属性。在接入AI大模型后，返回的字符串会带有特殊字符用于做文字处理，下面代码简单进行了文字处理展示。2、代码实现1、NSString+Markdown.h#importNS_ASSUME_N
  • IOS兼容 - uniapp ios固定定位失效与刘海屏的坑 月白星兮 iosuni-appcocoa
    问题描述uniapp一套代码，打包之后安卓可以正常显示版本号，IOS不可以错误现象：IOS只有滚动到屏幕底部才能看到版本号原因分析：IOS设计更希望屏幕跟随着用户滚动而滚动，所以无法实现相对浏览器窗口的固定定位。IOS实现的功能是相对最近的允许滚动的元素定位，且不能遮罩滚动元素的兄弟吉父元素的兄弟元素。一般情况：固定定位是相对于浏览器窗口，且可以使页面中的某个元素不随浏览器的滚动而消失IOS固定定
  • Python 爬虫：一文掌握 SVG 映射反爬虫 数据知道 2025年爬虫和逆向教程python爬虫microsoft爬虫逆向数据采集
    更多内容请见：爬虫和逆向教程-专栏介绍和目录文章目录1.SVG概述1.1SVG的优点1.1映射反爬虫的原理2.SVG映射反爬虫的示例3.应对SVG映射反爬虫的方法3.1解析SVG图像3.2处理自定义字体3.3使用OCR技术3.4动态生成SVG的处理4.实战案例4.1使用SVG映射显示价格4.2解析SVG文件并提取其中的内容和属性4.3模拟交互行为4.4使用无头浏览器4.5某网站使用SVG实现动态验
  • 软件代码测试如何进行?专业第三方软件测评机构分享 第三方软件测评 软件测试
    软件代码测试是对软件应用程序进行评估的过程，旨在发现软件中的缺陷、错误或潜在问题，确保软件的功能、性能和安全性满足预定的要求。简而言之，软件测试可以看作是对代码进行的一次“健康检查”，通过系统的测试手段，发现并修复程序中的问题。一、软件代码测试的流程1、明确测试目标:设定要测试的功能、性能要求及其他重要标准。2、设计测试用例:根据需求文档和设计文档编写详细的测试用例，涵盖各个测试维度。3、执行测试
  • 深入探索iOS底层原理：多线程技术与编程学习 CqppDeveloper ios学习cocoa编程学习
    在iOS开发中，多线程技术是至关重要的。它可以帮助我们实现并发执行任务、提高应用程序的响应性能，并充分利用设备的多核处理能力。本文将深入探讨iOS底层原理中与多线程相关的概念和技术，并提供相应的源代码示例。线程与进程的基本概念在开始之前，我们需要了解一些基本概念。线程（Thread）是操作系统调度的最小单位，它是程序执行的单个路径。一个进程（Process）可以包含多个线程，它们共享进程的内存空间
  • C#中的设计模式：构建更加优雅的代码 Envyᥫᩣᩚ c#开发语言
    C#在面向对象编程（OOP）方面的强大支持，我们可以探讨“C#中的设计模式”。这不仅有助于理解如何更好地组织代码，还能提高代码的可维护性和可扩展性。引言设计模式是软件工程中经过实践验证的解决方案模板，它们提供了一种标准化的方法来解决常见的开发问题。对于使用C#进行开发的程序员来说，理解和应用这些模式可以帮助创建结构良好、易于维护和扩展的应用程序。本文将介绍几种常用的设计模式，并展示如何用C#实现它
  • mondb入手 木zi_鸣 mongodb
    windows 启动mongodb  编写bat文件， mongod --dbpath D:\software\MongoDBDATA mongod --help  查询各种配置 配置在mongob 打开批处理，即可启动，27017原生端口，shell操作监控端口  扩展28017，web端操作端口 启动配置文件配置， 数据更灵活 
  • 大型高并发高负载网站的系统架构 bijian1013 高并发负载均衡
            扩展Web应用程序 一.概念         简单的来说，如果一个系统可扩展，那么你可以通过扩展来提供系统的性能。这代表着系统能够容纳更高的负载、更大的数据集，并且系统是可维护的。扩展和语言、某项具体的技术都是无关的。扩展可以分为两种：         1.
  • DISPLAY变量和xhost(原创) czmmiao display
    DISPLAY 在Linux/Unix类操作系统上, DISPLAY用来设置将图形显示到何处. 直接登陆图形界面或者登陆命令行界面后使用startx启动图形, DISPLAY环境变量将自动设置为:0:0, 此时可以打开终端, 输出图形程序的名称(比如xclock)来启动程序, 图形将显示在本地窗口上, 在终端上输入printenv查看当前环境变量, 输出结果中有如下内容:DISPLAY=:0.0
  • 获取B/S客户端IP 周凡杨 java编程jspWeb浏览器
       最近想写个B/S架构的聊天系统，因为以前做过C/S架构的QQ聊天系统，所以对于Socket通信编程只是一个巩固。对于C/S架构的聊天系统，由于存在客户端Java应用，所以直接在代码中获取客户端的IP，应用的方法为：    String ip = InetAddress.getLocalHost().getHostAddress(); 然而对于WEB
  • 浅谈类和对象 朱辉辉33 编程
        类是对一类事物的总称，对象是描述一个物体的特征，类是对象的抽象。简单来说，类是抽象的，不占用内存，对象是具体的， 占用存储空间。     类是由属性和方法构成的，基本格式是public  class 类名{ //定义属性 private/public 数据类型 属性名； //定义方法 publ
  • android activity与viewpager+fragment的生命周期问题 肆无忌惮_ viewpager
    有一个Activity里面是ViewPager，ViewPager里面放了两个Fragment。 第一次进入这个Activity。开启了服务，并在onResume方法中绑定服务后，对Service进行了一定的初始化，其中调用了Fragment中的一个属性。 super.onResume(); bindService(intent, conn, BIND_AUTO_CREATE);
  • base64Encode对图片进行编码 843977358 base64图片encoder
    /** * 对图片进行base64encoder编码 * * @author mrZhang * @param path * @return */ public static String encodeImage(String path) { BASE64Encoder encoder = null; byte[] b = null; I
  • Request Header简介 aigo servlet
    当一个客户端(通常是浏览器)向Web服务器发送一个请求是，它要发送一个请求的命令行，一般是GET或POST命令，当发送POST命令时，它还必须向服务器发送一个叫“Content-Length”的请求头(Request   Header)   用以指明请求数据的长度，除了Content-Length之外，它还可以向服务器发送其它一些Headers，如：    
  • HttpClient4.3 创建SSL协议的HttpClient对象 alleni123 httpclient爬虫ssl
    public class HttpClientUtils { public static CloseableHttpClient createSSLClientDefault(CookieStore cookies){ SSLContext sslContext=null; try { sslContext=new SSLContextBuilder().l
  • java取反 -右移-左移-无符号右移的探讨 百合不是茶 位运算符 位移
    取反： 在二进制中第一位，1表示符数，0表示正数 byte a = -1; 原码：10000001 反码：11111110 补码：11111111 //异或: 00000000 byte b = -2; 原码：10000010 反码：11111101 补码：11111110 //异或: 00000001
  • java多线程join的作用与用法 bijian1013 java多线程
            对于JAVA的join，JDK 是这样说的：join public final void join （long millis ）throws InterruptedException Waits at most millis milliseconds for this thread to die. A timeout of 0 means t
  • Java发送http请求(get 与post方法请求) bijian1013 javaspring
    PostRequest.java package com.bijian.study; import java.io.BufferedReader; import java.io.DataOutputStream; import java.io.IOException; import java.io.InputStreamReader; import java.net.HttpURL
  • 【Struts2二】struts.xml中package下的action配置项默认值 bit1129 struts.xml
    在第一部份，定义了struts.xml文件，如下所示：   <!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN" "http://struts.apache.org/dtds/struts
  • 【Kafka十三】Kafka Simple Consumer bit1129 simple
    代码中关于Host和Port是割裂开的，这会导致单机环境下的伪分布式Kafka集群环境下，这个例子没法运行。 实际情况是需要将host和port绑定到一起，   package kafka.examples.lowlevel; import kafka.api.FetchRequest; import kafka.api.FetchRequestBuilder; impo
  • nodejs学习api ronin47 nodejs api
    NodeJS基础 什么是NodeJS JS是脚本语言，脚本语言都需要一个解析器才能运行。对于写在HTML页面里的JS，浏览器充当了解析器的角色。而对于需要独立运行的JS，NodeJS就是一个解析器。 每一种解析器都是一个运行环境，不但允许JS定义各种数据结构，进行各种计算，还允许JS使用运行环境提供的内置对象和方法做一些事情。例如运行在浏览器中的JS的用途是操作DOM，浏览器就提供了docum
  • java-64.寻找第N个丑数 bylijinnan java
    public class UglyNumber { /** * 64.查找第N个丑数 具体思路可参考 [url] http://zhedahht.blog.163.com/blog/static/2541117420094245366965/[/url] * 题目：我们把只包含因子 2、3和5的数称作丑数（Ugly Number）。例如6、8都是丑数，但14
  • 二维数组（矩阵）对角线输出 bylijinnan 二维数组
    /** 二维数组 对角线输出 两个方向 例如对于数组： { 1, 2, 3, 4 }, { 5, 6, 7, 8 }, { 9, 10, 11, 12 }, { 13, 14, 15, 16 }, slash方向输出： 1 5 2 9 6 3 13 10 7 4 14 11 8 15 12 16 backslash输出： 4 3
  • [JWFD开源工作流设计]工作流跳跃模式开发关键点(今日更新) comsci 工作流
       既然是做开源软件的,我们的宗旨就是给大家分享设计和代码,那么现在我就用很简单扼要的语言来透露这个跳跃模式的设计原理    大家如果用过JWFD的ARC-自动运行控制器,或者看过代码,应该知道在ARC算法模块中有一个函数叫做SAN(),这个函数就是ARC的核心控制器,要实现跳跃模式,在SAN函数中一定要对LN链表数据结构进行操作,首先写一段代码,把
  • redis常见使用 cuityang redis常见使用
    redis 通常被认为是一个数据结构服务器，主要是因为其有着丰富的数据结构 strings、map、 list、sets、 sorted sets 引入jar包 jedis-2.1.0.jar  (本文下方提供下载) package redistest; import redis.clients.jedis.Jedis; public class Listtest
  • 配置多个redis dalan_123 redis
    配置多个redis客户端 <?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.springframework.org/schema/beans"       xmlns:xsi=&quo
  • attrib命令 dcj3sjt126com attr
      attrib指令用于修改文件的属性.文件的常见属性有:只读.存档.隐藏和系统.    只读属性是指文件只可以做读的操作.不能对文件进行写的操作.就是文件的写保护.    存档属性是用来标记文件改动的.即在上一次备份后文件有所改动.一些备份软件在备份的时候会只去备份带有存档属性的文件. 
  • Yii使用公共函数 dcj3sjt126com yii
    在网站项目中，没必要把公用的函数写成一个工具类，有时候面向过程其实更方便。 在入口文件index.php里添加 require_once('protected/function.php'); 即可对其引用，成为公用的函数集合。 function.php如下：   <?php /**   * This is the shortcut to D
  • linux 系统资源的查看（free、uname、uptime、netstat） eksliang netstatlinux unamelinux uptimelinux free
    linux 系统资源的查看 转载请出自出处：http://eksliang.iteye.com/blog/2167081   http://eksliang.iteye.com 一、free查看内存的使用情况 语法如下：   free [-b][-k][-m][-g] [-t] 参数含义 -b:直接输入free时，显示的单位是kb我们可以使用b(bytes),m
  • JAVA的位操作符 greemranqq 位运算JAVA位移<<>>>
    最近几种进制，加上各种位操作符，发现都比较模糊，不能完全掌握，这里就再熟悉熟悉。   1.按位操作符 ：    按位操作符是用来操作基本数据类型中的单个bit,即二进制位，会对两个参数执行布尔代数运算，获得结果。    与（&）运算：    1&1 = 1, 1&0 = 0, 0&0 &
  • Web前段学习网站 ihuning Web
      Web前段学习网站 菜鸟学习：http://www.w3cschool.cc/   JQuery中文网：http://www.jquerycn.cn/   内存溢出：http://outofmemory.cn/#csdn.blog   http://www.icoolxue.com/   http://www.jikexue
  • 强强联合：FluxBB 作者加盟 Flarum justjavac r
    原文：FluxBB Joins Forces With Flarum作者：Toby Zerner译文：强强联合：FluxBB 作者加盟 Flarum译者：justjavac FluxBB 是一个快速、轻量级论坛软件，它的开发者是一名德国的 PHP 天才 Franz Liedke。FluxBB 的下一个版本(2.0)将被完全重写，并已经开发了一段时间。FluxBB 看起来非常有前途的，
  • java统计在线人数（session存储信息的） macroli javaWeb
    这篇日志是我写的第三次了 前两次都发布失败！郁闷极了！   由于在web开发中常常用到这一部分所以在此记录一下，呵呵，就到备忘录了！ 我对于登录信息时使用session存储的，所以我这里是通过实现HttpSessionAttributeListener这个接口完成的。 1、实现接口类，在web.xml文件中配置监听类，从而可以使该类完成其工作。 public class Ses
  • bootstrp carousel初体验 快速构建图片播放 qiaolevip 每天进步一点点学习永无止境bootstrap纵观千象
    img{ border: 1px solid white; box-shadow: 2px 2px 12px #333; _width: expression(this.width > 600 ? "600px" : this.width + "px"); _height: expression(this.width &
  • SparkSQL读取HBase数据，通过自定义外部数据源 superlxw1234 sparksparksqlsparksql读取hbasesparksql外部数据源
    关键字：SparkSQL读取HBase、SparkSQL自定义外部数据源     前面文章介绍了SparSQL通过Hive操作HBase表。   SparkSQL从1.2开始支持自定义外部数据源(External DataSource)，这样就可以通过API接口来实现自己的外部数据源。这里基于Spark1.4.0，简单介绍SparkSQL自定义外部数据源，访
  • Spring Boot 1.3.0.M1发布 wiselyman spring boot
        Spring Boot 1.3.0.M1于6.12日发布，现在可以从Spring milestone repository下载。这个版本是基于Spring Framework 4.2.0.RC1,并在Spring Boot 1.2之上提供了大量的新特性improvements and new features。主要包含以下：   1.提供一个新的sprin
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他