ChinaTrojangirl
ChinaTrojangirl

学习web前端之练习一

web前端练习-模仿DJI首页（新手第一篇）

（图片和文本水平垂直居中 、标签之间的距离控制、标签大小的设置）

自学web前端技术也有几个月了，学到jQuery，忽然学不下去了，想动手看看自己的水平。老公推荐我去模仿大疆的首页，果然，这种高科技公司的首页还是很炫酷的，今天就把我的学习心得写下来，就当自己的学习笔记，也可以与各位同行交流学习。今天写了导航栏，只写了CSS。还有很多不够精简的地方和不足，望指正。

  • 导航栏图片
  • HTML代码
  • CSS代码

(1)效果图片

导航栏

(2)HTML代码


<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>title>
    <link href="../STYLE/common.css" rel="stylesheet">
    <script src="../JS/jquery-1.11.1.js">script>
head>
<body>
        <div id="nav" >
            <div id="nav-content" >
                <div id="nav-logo">
                    <a class="nav-brand">
                        <img src="../images/logo.png" />
                    a>
                div>
                <div id="nav-list">
                    <ul class="product-list">
                        <li>PHANTOMli>
                        <li>"悟"INSPIRE1li>
                        <li>灵眸 OSMOli>
                        <li>如影 RONINli>
                        <li>行业应用li>
                        <li>开发者套件li>
                        <li>社区li>
                        <li>服务与支持li>
                    ul>
                    <div id="nav-search">div>
                    <ul class="nav-right">
                        <li class="search-box">
                            <a class="search-box-link" href="#">
                                <span class="icon-search">span>
                            a>
                        li>
                        <li class="shopping-center">
                            <a class="shopping-center-link" href="#">
                            <span>商城span>
                            <span class="icon-shopping">span>
                            a>
                        li>
                        <li class="language-change">
                            <a class="language-change-link" href="#">
                                <span class="icon-language">span>
                                <span>简体中文span>
                            a>
                         li>
                        <li class="personal">
                            <a class="personal-link">
                               <span class="personal-center">span>
                            a>
                        li>
                    ul>
                div>
            div>
        div>
body>
html>

(3)CSS样式

*{
    margin: 0;
    padding: 0;
}

*::before *::after{
    box-sizing: border-box;
}

body{
    overflow-y: scroll;
}

html body{
    color: #979797;
    font-size: 14px;
    text-align: center;
}

#nav::before #nav-content::before #nav-logo::before #nav-list::before #nav::after #nav-content::after #nav-logo::after #nav-list::after{
    content: "";
    display: table;
}

#nav{
    width: 100%;
    height: 60px;
    margin-left: auto;
    margin-right: auto;
    line-height: 60px;
}

#nav #nav-content{
    margin-left: auto;
    margin-right: auto;
    max-width: 1230px;
    height: 60px;
}

#nav #nav-content #nav-logo{
    height: 60px;
    line-height: 60px;
    float: left;
}

#nav #nav-content #nav-logo .nav-brand{
    display: block;
    margin-right: 12px;
    float: left;
    font-size: 18px;
    height: 50px;
    line-height: 20px;
    padding: 15px 0 15px 15px;
}

#nav #nav-content #nav-logo img{
    width: 50px;
    display: block;
}

a img{
    border: medium none;
}

#nav #nav-content #nav-list{
    padding: 0px 15px;
    height: 60px;
}

ul li{
    float: left;
    list-style: none;
}

#nav .product-list li{
    font-size: 12px;
    word-spacing: -1px;
    font-style: inherit;
    font-weight: inherit;
    font-family: inherit;
    padding: 15px 10px;
    line-height: 30px;
}

#nav #nav-content #nav-list a{
    color: #979797;
    cursor: pointer;
    font-size: 12px;
    font-weight: 400;
    height: 30px;
    padding: 15px 25px 15px 10px;
    line-height: 30px;
    text-decoration: none;
}

#nav #nav-content #nav-list .nav-right{
    float: right !important;
}

#nav #nav-content #nav-list .search-box{
    height: 60px;
}

#nav #nav-content #nav-list .search-box .search-box-link{
    display: block;
}

#nav #nav-content #nav-list .search-box .search-box-link .icon-search{
    background: url("../images/search-icon.png");
    background-position: -400px -49px;
    display: inline-block;
    margin-top: 7px;
    width: 16px;
    height: 16px;


}
#nav #nav-content #nav-list .shopping-center{
    background: #44a8f2;
    min-width: 162px ;
    height: 60px;
    display: inline-block;
}

#nav #nav-content #nav-list .shopping-center-link{
    display: block;
    color: #f7f8f9;
    font-size: 12px;
    font-weight: 400;
    height: 30px;
    padding: 15px 10px;
    line-height: 30px;
    text-align: center;
    text-transform: uppercase;
    transition: all 300ms ease 0s;
}
#nav #nav-content #nav-list .shopping-center .icon-shopping{
    background: url("../images/icon-shopping.png");
    background-position: -418px -224px;
    width:20px;
    height: 14px;
    display: inline-block;
    margin-left: 8px;
    position: relative;
    top: 2px;
}

#nav #nav-content #nav-list .language-change{
    min-width: 110px;
    position: relative;
}

#nav #nav-content #nav-list .language-change-link{
    align-items: center;
    display: flex;
    justify-content: space-around;
    padding: 15px;
    text-align: center;
    text-transform: uppercase;
}

#nav #nav-content #nav-list .language-change .icon-language{
    background: url("../images/icon-language.png") no-repeat scroll left top / 15px 15px;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 0 4px 0 0;
    vertical-align: middle;
}

#nav #nav-content #nav-list .personal{
    position: relative;
    min-width: 45px;
}

#nav #nav-content #nav-list .personal-link{
    padding: 15px 0;
    display: block;
    line-height: 30px;
}

#nav #nav-content #nav-list .personal-center{
    background:url("../images/icon-person.png");
    background-position: -399px -190px;
    display: inline-block;
    margin-top: 5px;
    width: 19px;
    height: 19px;
}

get技能

(1)图标放在span标签里，设置为背景图片，要设置宽和高，还有要显示的位置。这里span的display属性为block，否则span的宽为0

(2)a标签要设置大小，display属性为block。

(3)float:right !important

(4)标签的命名，源网站的命名是比较有层次的，需要学习。

你可能感兴趣的:(新手篇)

  • 第二十九篇 数据仓库与商务智能：技术演进与前沿趋势深度解析 随缘而动，随遇而安 数据库数据仓库大数据数据库架构数据库开发
    声明：文章内容仅供参考，需仔细甄别。文中技术名称属相关方商标，仅作技术描述；代码示例为交流学习用途，部分参考开源文档（Apache2.0/GPLv3）；案例数据已脱敏，技术推荐保持中立；法规解读仅供参考，请以《网络安全法》《数据安全法》官方解释为准。目录一、核心差异：技术定位与实现路径1.1核心能力矩阵二、协同关系：现代数据供应链的双引擎2.1数据价值链协同2.2典型技术栈集成三、前沿技术动态（2
  • AI实干家：HK深度体验-【第3篇-香港、新加坡、深圳、上海、首尔五座城市在金融数据维度的对比分析】 SZ0771 人工智能大数据
    以下是香港、新加坡、深圳、上海、首尔五座城市在金融数据维度的对比分析，涵盖货币流通量、存货款规模、资本市场活跃度、国际贸易、外资及外汇储备等关键指标，结合最新公开数据及全球金融中心排名动态：一、货币流通量（M0-M1-M2）由于城市层面货币供应量（M0、M1、M2）数据通常由国家统一统计，以下以金融机构本外币存款余额（反映广义货币M2的存量规模）为主要参考：城市本外币存款余额（2024年末）增速（
  • 深入分析串口使用rs485功能的内部机制之使用gpio控制传输方向读取rs485温湿度传感器数据（第一期） @曙光， linux网络嵌入式
    前言首先这是一篇涉及内核分析的，学习这篇文章最好是打开内核源码跟着我的分析去看，我参考的内核源码是linux5.4内核，也可以辅助ai去分析。ModbusRTU读取rs485温湿度传感器使用ModbusRTU读取rs485温湿度传感器有俩种方法，第一种采用gpio控制数据的传输方向：高电平表示主发从收，低电平表示主收从发。第二种采用硬件流控的方法使用串口的rts引脚和cts引脚自动控制收发方向，接
  • 嵌入式硬件篇---WIFI模块 Ronin-Lotus 程序代码篇嵌入式硬件篇嵌入式硬件cWIFI
    文章目录前言一、核心工作原理1.物理层（PHY）工作频段2.4GHz5GHz调制技术直接序列扩频正交频分复用高效数据编码2.协议栈架构MAC层Beacon帧4次握手3.核心工作模式二、典型应用场景1.智能家居系统远程控制环境监测视频监测2.工业物联网设备远程运维生产线监控仓储管理3.医疗设备远程诊疗医疗影像药品管理4.消费电子智能音箱游戏设备打印设备三、ESP32开发示例1.环境配置（Platfo
  • APP怎么抓取原生日志 - Android篇 大汉堡玩测试 android功能测试
    文章目录前言为什么要抓原生页面的日志举一个抓取原生日志的例子AndroidDebugBridge(ADB)安装ADB连接设备验证连接抓取日志注意点总结前言好困~写点我觉得重要的吧，IOS和HarmonyOSNEXT这周写为什么要抓原生页面的日志原生日志能够捕捉到与操作系统和应用框架交互的关键信息，包括性能瓶颈、崩溃报告和安全事件等，而这些是纯H5日志无法提供的，确保了对应用行为的全面监控和精准调试
  • Hugging Face预训练GPT微调ChatGPT（微调入门！新手友好！） y江江江江 机器学习大模型gptchatgpt
    HuggingFace预训练GPT微调ChatGPT（微调入门！新手友好！）在实战中，⼤多数情况下都不需要从0开始训练模型，⽽是使⽤“⼤⼚”或者其他研究者开源的已经训练好的⼤模型。在各种⼤模型开源库中，最具代表性的就是HuggingFace。HuggingFace是⼀家专注于NLP领域的AI公司，开发了⼀个名为Transformers的开源库，该开源库拥有许多预训练后的深度学习模型，如BERT、G
  • 【typescript进阶篇】(第四章) webpack编译ts及第三方库声明文件 蒜香拿铁 typescript系列typescriptwebpackjavascript
    使用webpack打包TS文件安装依赖安装webpack环境npmiwebpackwebpack-cliwebpack-dev-server-D安装TypeScriptnpminstalltypescript-D编译TSnpminstallts-loader-D热更新服务npminstallwebpack-dev-server-DHTML模板npminstallhtml-webpack-plugi
  • rag-给一篇几百页的pdf，如何从中找到关键信息并汇总出关系图 蒸土豆的技术细节 人工智能
    小思考对pdf肯定要做模糊chunk，能用模型切分就用模型切分，不能用模型就用规则，规则要尽可能保存连续文本，特殊数据格式（图、表格）必须完整保存，必须能被捕捉到。这些独立的表格or图数据，也要单独做embedding，以其中的title和行列title信息作embedding材料。也不能忘了传统搜索方法，基于搜索的、基于传统词频的、基于关键字的。。。假设已经找到了信息所在的目标，如果它是个表格，
  • 基于BCLinux制作Apache HTTPD 2.4.63 的RPM安装包 IT布道 apache
    在这之前，我写过一篇《基于CentOS7制作ApacheHTTPD2.4.58的RPM安装包》的文章。本文大部分内容和之前差不多，但因为操作系统由CentOS7变成了BC-Linux，所以，有些内容就可以删减了。编译环境：操作系统：BC-Linuxhttpd版本：2.4.63制作工具：rpmbuild（这个之前的文章有介绍，看这里）下载httpd源码：官网目前的最新版本是2.4.63(2025.1
  • 10篇R1相关的研究全面汇总，万字思考！ datawhale
    原创长琴DatawhaleDatawhale干货作者：长琴，Datawhale成员本文通过10篇R1相关的研究，介绍R1后LLM的新范式。其核心就是如何进一步增强LLM的能力。本文中的相关阅读，可以在主页找到对应文章：主页地址：https://yam.gift/基本框架首先是整体的框架，如下所示。•Base+SFT•R1冷启动•LIMO(817DataSelection)•s1(1000)•Bas
  • 解析：浏览器事件冒泡及事件捕获 C860 浏览器浏览器
    今天的效率有点奇葩，说高吧，一个上午做了不少事。说低吧，因为一个分布式的算法花了我不少时间，终于有点头绪。估计明天会写一篇文章来讲述一下自己的看法。而今天，还是回到前端。今天来说说事件冒泡和事件捕获。首先肯定是概念：什么是事件冒泡？什么是事件捕获？简单地说，事件冒泡和事件捕获都是一种事件传递的机制。这种机制可以使事件在不同级的元素间传递。事件冒泡是从事件触发的源节点，向父节点传递，直到到达最顶节点
  • ROS CDK魔法书：建立你的游戏王国（JavaScript篇） 阿里云CloudOps 资源编排ROS游戏javascript开发语言阿里云ROSCDK
    引言在虚拟游戏的世界里，数字化的乐趣如同流动的音符，谱写着无数玩家的共同回忆。而在这片充满创意与冒险的乐园中，您的使命就是将独特的游戏体验与丰富的技术知识相结合，打造出令人难以忘怀的作品。当面对如何实现这一宏伟蓝图时，您或许会想：如何将一款简单而富有趣味的游戏部署到云端，使更多玩家共享这份乐趣？别担心，现在您手中握有一把开启无限可能的大门钥匙——阿里云资源编排服务（ResourceOrchestr
  • src小白入门简介 吃饱饭，练球 安全网络安全src
    隐雾src01为什么别人挖得到洞你挖不到？相信有很多师傅都有在网上看过不少别人发的挖洞的文章为什么你看完之后感觉自己懂了，但真正去实战的时候却挖不到？这就涉及到一个知识转化率的问题在读完这篇文章之后你有没有抓住细节、抓住该学习的点呢？以前怎么样不重要，现在教你们怎么去读一篇文章，然后学习到自己想要的这里我拿北山的一篇文章做例子：https://mp.weixin.qq.com/s?__biz=Mz
  • 利用你的完美主义天赋—超能力使用指南（上） 魙先生 辨证系列生活问题都有解/让自己变更好工作问题都有解/让工作更顺利生活
    前情回顾：《完美还是完成》（二）：你的完美主义—从缺陷到超能力你的过度准备，有时会沉淀为他人无法复制的专业壁垒你的想太多，其实是提前填坑把焦虑变成“弹药库”，需要时随时掏证据。完美主义不是胆小，而是带着救生圈学冲浪本期：《完美还是完成》（三）：请好好利用你的完美主义天赋—完美主义的超能力使用指南：怎么做（细化方法篇）■怎么做：方法把完美主义工具化，让它为你所用●允许战略不完美，践行60分微习惯：完
  • 从零开始写C++3D游戏引擎（开发环境VS2022+OpenGL）之十一点二五 光照贴图(lighting maps)的实现 细嚼慢咽逐条读代码系列 金沙阳 c++3d游戏引擎
    写在篇前的话作为一个曾经在代码堆里面苦苦挣扎的萌新，困惑的事情在于库，各种依赖，包换文件，链接库，纠结于代码的作用意义。尤其在3D引擎开发的问题上，很多人都被各种困难给阻拦，放弃了在3D渲染，3D游戏引擎上大涨鸿图的机会。当然关于3D游戏引擎的教程已经汗牛充栋，但是大部分的教程都是由过来人写的，代码中的逻辑与实现，在过来人眼中自然且简单，在初学者眼里却是晦涩繁杂，因此从一个初学者的角度来写一篇关于
  • iOS发布app到App Store教程 Cloudox_ iOS拾遗iOS之海iOS发布App发布证书AppStore
    要发布首先需要发布证书，其获取和安装的基本流程和真机调试证书一致，关于真机调试证书的获取和使用可以参考这篇文章。不过现在Xcode7不需要真机调试证书也可实现真机调试了，可以参考这篇文章。要获取证书，以及发布app，都需要开发者账号，开发者账号分为个人和企业两种，在https://developer.apple.com/programs/这个网站注册。关于申请开发者账号，有时间再写一篇文章好啦。获
  • 【DevOps工具篇】Keycloak安装配置及脚本化 小涵 DevOps企业级项目实战devops运维keycloak
    目录脚本化要求步骤步骤1：安装并启动Keycloak服务器[](#step-1-installing-and-starting-the-keycloak-server)分发文件进行安装Docker映像进行安装在OpenShift内的Docker映像中安装步骤2：连接管理CLI[](#step-2-connecting-the-admin-cli)步骤3：配置[](#step-3-configuri
  • 【玩转google云】在 Google Cloud 和 AWS 之间创建高可用性 VPN 连接（二） Coder加油! 手把手教学玩转google云aws云计算devops客户网关虚拟网关
    目录1、安装AWSCLI2、配置AWSCLI3、AWS命令创建两个客户网关4、创建虚拟网关并将其挂接到您的VPC网络5、创建采用动态路由的VPN连接上一篇我们讲到了怎么在在GoogleCloud上创建高可用性VPN网关和路由器，这一篇我们将介绍怎么在AWS上面创建网关和VPN连接。AWS命令行界面(AWSCLI)是一种开源工具，允许您使用命令行操作AWS服务。您可以使用AWSCLI自动化任务、管理
  • springboot独立邮件服务器,后端篇-SpringBoot–自定义域名发送邮件 洋莞成
    前言最近的一个小项目用到了邮件发送的功能，由于自己实现一套SMTP比较复杂，于是借助第三方如QQ邮箱或网易邮箱或Gmail等邮件系统实现此功能，在开发过程中我使用了网易邮箱，并申请了免费的网易企业邮箱实现自定义域名发送邮件。邮件协议SMTPSMTP(SimpleMailTransferProtocol)即简单邮件传输协议是一个在互联网上传输电子邮件的标准。POPPOP(PostOfficeProt
  • 详解离线安装Python库 爱编程的喵喵 Python基础课程python离线安装requirements
      大家好，我是爱编程的喵喵。双985硕士毕业，现担任全栈工程师一职，热衷于将数据思维应用到工作与生活中。从事机器学习以及相关的前后端开发工作。曾在阿里云、科大讯飞、CCF等比赛获得多次Top名次。现为CSDN博客专家、人工智能领域优质创作者。喜欢通过博客创作的方式对所学的知识进行总结与归纳，不仅形成深入且独到的理解，而且能够帮助新手快速入门。  本文主要介绍了详解离线安装Python库，希望能对
  • C++编程：从入门到精通的指南 zifeng0015 c++javajvm
    本文将引导读者走进C++编程的世界，从基础知识讲起，逐步深入到高级特性。无论你是编程新手还是希望提升C++技能的开发者，本文都将为你提供有价值的指导和建议。正文：一、C++简介C++是一种面向对象的编程语言，由BjarneStroustrup于1985年开发。它结合了C语言的低级特性和面向对象编程的高级特性，因此既适合进行系统级编程，也适合进行大型应用软件开发。二、C++基础变量和数据类型：C++
  • 《Java八股文の文艺复兴》第四篇：ThreadLocal的平行宇宙——弱引用是通往OOM的时空虫洞？ 程序猿chen 面霸の自我修养（面试篇）「Java八股文の文艺复兴」java开发语言后端面试跳槽职场和发展安全
    楔子：量子泡沫中的幽灵代码"当你在ThreadLocal中写入秘密时，整个宇宙的线程都在窥视它。"上一场战役我们封印了ConcurrentHashMap的熵增奇点，但新的危机正在量子泡沫中酝酿。在某个平行宇宙里，一行看似无害的threadLocal.set(user)正在撕裂JVM的内存维度，而弱引用竟成为打开OOM虫洞的钥匙。此刻，让我们戴上RASP打造的因果律护目镜，穿越ThreadLocal
  • 什么是联盟营销？2025新手怎么入局联盟营销？ 跨境知识搬运工 facebook大数据
    联盟营销为商家和营销人员提供了一个低成本、高效益的合作平台，同时也让消费者能够享受更多的优惠和产品推荐。那么，什么是联盟营销？如何入局联盟营销，尤其是对于新手来说，又该如何开始这项业务？本文将详细介绍这些问题，并帮助你了解如何顺利入局联盟营销。一、什么是联盟营销？联盟营销是一种基于成果的合作营销模式。在这种模式下，商家与联盟营销者（即“推广者”或“发布者”）合作，推广其产品或服务。联盟营销者通过推
  • 什么是联盟营销？2025新手怎么入局联盟营销？ 纯干苹果派 人工智能大数据
    联盟营销为商家和营销人员提供了一个低成本、高效益的合作平台，同时也让消费者能够享受更多的优惠和产品推荐。那么，什么是联盟营销？如何入局联盟营销，尤其是对于新手来说，又该如何开始这项业务？本文将详细介绍这些问题，并帮助你了解如何顺利入局联盟营销。一、什么是联盟营销？联盟营销是一种基于成果的合作营销模式。在这种模式下，商家与联盟营销者（即“推广者”或“发布者”）合作，推广其产品或服务。联盟营销者通过推
  • 基础篇：ArkTS基础语法介绍 言程序plus 鸿蒙Next开发javascriptarkts鸿蒙
    前言：目前流行的编程语言TypeScript是在JavaScript基础上通过添加类型定义扩展而来的，而ArkTS则是TypeScript的进一步扩展。TypeScript深受开发者的喜爱，因为它提供了一种更结构化的JavaScript编码方法。ArkTS旨在保持TypeScript的大部分语法，为现有的TypeScript开发者实现无缝过渡，让移动开发者快速上手ArkTS。ArkTS比typeS
  • SAP之顾问篇 FF.5电子银行对账单 SAP圣父 SAP
    直接上干货一.配置财务会计→银行会计核算→业务往来→支付交易→电子银行对账单→进行电子银行对账单的全局设置1.创建科目符号例:ZS012.对科目符号分配科目给ZS01设置总账科目3.创建过账规则码例:Z0014.定义过账规则给Z001设置借贷方过账代码，借贷方科目5.创建业务类型例:ZT016.对过账规则分配外部事务类型给ZT01设置外部交易码(※2)，设置过账规则:Z0017.对事务类型分配银行
  • Python的那些事第四十六篇：基于属性的测试库hypothesis研究 暮雨哀尘 Python的那些事python开发语言属性测试库hypothesis执行流程构建
    一、引言（一）研究背景随着软件系统复杂性的不断增加，软件测试在确保软件质量方面的重要性愈发凸显。传统测试方法在面对大规模、复杂软件系统时，往往存在测试用例设计不全面、测试执行效率低下等问题。基于属性的测试作为一种新兴的测试方法，通过定义软件系统的属性来指导测试用例的设计与执行，为解决上述问题提供了新的思路。（二）研究意义本研究旨在深入探讨基于属性的测试库的构建与应用，以提高软件测试的效率和质量，降
  • 开源模型应用落地-qwen模型小试-调用Qwen2-7B-Instruct-进阶篇（十二） 开源技术探险家 开源模型-实际应用落地#深度学习自然语言处理语言模型
    一、前言经过前五篇“qwen模型小试”文章的学习，我们已经熟练掌握qwen大模型的使用。然而，就在前几天阿里云又发布了Qwen2版本。无论是语言模型还是多模态模型，均在大规模多语言和多模态数据上进行预训练，并通过高质量数据进行后期微调以贴近人类偏好。本文将介绍如何使用Transformers库进行模型推理（相较于qwen1系列，使用方式上有较大的调整），现在，我们赶紧跟上脚步，去体验一下新版本模型
  • PyTorch 深度学习实战（19）：离线强化学习与 Conservative Q-Learning (CQL) 算法 进取星辰 PyTorch深度学习实战深度学习pytorch算法
    在上一篇文章中，我们探讨了分布式强化学习与IMPALA算法，展示了如何通过并行化训练提升强化学习的效率。本文将聚焦离线强化学习（OfflineRL）这一新兴方向，并实现ConservativeQ-Learning(CQL)算法，利用Minari提供的静态数据集训练安全的强化学习策略。一、离线强化学习与CQL原理1.离线强化学习的特点无需环境交互：直接从预收集的静态数据集学习数据效率高：复用历史经验
  • 【MYSQL学习】5分钟学会MySQL登录，新手也能轻松搞定？ 墨瑾轩 MySql入门~精通mysql学习adb
    关注墨瑾轩，带你探索编程的奥秘！超萌技术攻略，轻松晋级编程高手技术宝库已备好，就等你来挖掘订阅墨瑾轩，智趣学习不孤单即刻启航，编程之旅更有趣5分钟学会MySQL登录，新手也能轻松搞定？引言嘿，小伙伴们！今天我们来聊聊MySQL的登录问题。对于初学者来说，登录数据库可能是你接触MySQL的第一步，也是最重要的一步。那么，MySQL是如何登录的呢？有哪些常见的问题需要注意？别急，今天我就带你一步步了解
  • java短路运算符和逻辑运算符的区别 3213213333332132 java基础
    /* * 逻辑运算符——不论是什么条件都要执行左右两边代码 * 短路运算符——我认为在底层就是利用物理电路的“并联”和“串联”实现的 * 原理很简单，并联电路代表短路或（||），串联电路代表短路与（&&）。 * * 并联电路两个开关只要有一个开关闭合，电路就会通。 * 类似于短路或（||），只要有其中一个为true（开关闭合）是
  • Java异常那些不得不说的事 白糖_ javaexception
    一、在finally块中做数据回收操作 比如数据库连接都是很宝贵的，所以最好在finally中关闭连接。 JDBCAgent jdbc = new JDBCAgent(); try{ jdbc.excute("select * from ctp_log"); }catch(SQLException e){ ... }finally{ jdbc.close();
  • utf-8与utf-8(无BOM)的区别 dcj3sjt126com PHP
    BOM——Byte Order Mark，就是字节序标记   在UCS 编码中有一个叫做"ZERO WIDTH NO-BREAK SPACE"的字符，它的编码是FEFF。而FFFE在UCS中是不存在的字符，所以不应该出现在实际传输中。UCS规范建议我们在传输字节流前，先传输 字符"ZERO WIDTH NO-BREAK SPACE"。这样如
  • JAVA Annotation之定义篇 周凡杨 java注解annotation入门注释
        Annotation: 译为注释或注解 An annotation, in the Java computer programming language, is a form of syntactic metadata that can be added to Java source code. Classes, methods, variables, pa
  • tomcat的多域名、虚拟主机配置 g21121 tomcat
    众所周知apache可以配置多域名和虚拟主机，而且配置起来比较简单，但是项目用到的是tomcat，配来配去总是不成功。查了些资料才总算可以，下面就跟大家分享下经验。 很多朋友搜索的内容基本是告诉我们这么配置： 在Engine标签下增面积Host标签，如下： <Host name="www.site1.com" appBase="webapps"
  • Linux SSH 错误解析（Capistrano 的cap 访问错误 Permission ） 510888780 linuxcapistrano
    1.ssh -v [email protected] 出现 Permission denied (publickey,gssapi-keyex,gssapi-with-mic,password). 错误 运行状况如下： OpenSSH_5.3p1, OpenSSL 1.0.1e-fips 11 Feb 2013 debug1: Reading configuratio
  • log4j的用法 Harry642 javalog4j
    一、前言：     log4j 是一个开放源码项目，是广泛使用的以Java编写的日志记录包。由于log4j出色的表现，     当时在log4j完成时，log4j开发组织曾建议sun在jdk1.4中用log4j取代jdk1.4 的日志工具类，但当时jdk1.4已接近完成，所以sun拒绝使用log4j，当在java开发中
  • mysql、sqlserver、oracle分页，java分页统一接口实现 aijuans oraclejave
    定义：pageStart 起始页，pageEnd 终止页,pageSize页面容量 oracle分页： 　　　　select * from ( select mytable.*,rownum num from (实际传的SQL) where rownum<=pageEnd) where num>=pageStart sqlServer分页：  
  • Hessian 简单例子 antlove javaWebservicehessian
    hello.hessian.MyCar.java package hessian.pojo; import java.io.Serializable; public class MyCar implements Serializable { private static final long serialVersionUID = 473690540190845543
  • 数据库对象的同义词和序列 百合不是茶 sql序列同义词ORACLE权限
    回顾简单的数据库权限等命令; 解锁用户和锁定用户 alter user scott account lock/unlock; //system下查看系统中的用户 select * dba_users; //创建用户名和密码 create user wj identified by wj; identified by //授予连接权和建表权 grant connect to
  • 使用Powermock和mockito测试静态方法 bijian1013 持续集成单元测试mockitoPowermock
            实例： package com.bijian.study; import static org.junit.Assert.assertEquals; import java.io.IOException; import org.junit.Before; import org.junit.Test; import or
  • 精通Oracle10编程SQL(6)访问ORACLE bijian1013 oracle数据库plsql
    /* *访问ORACLE */ --检索单行数据 --使用标量变量接收数据 DECLARE v_ename emp.ename%TYPE; v_sal emp.sal%TYPE; BEGIN select ename,sal into v_ename,v_sal from emp where empno=&no; dbms_output.pu
  • 【Nginx四】Nginx作为HTTP负载均衡服务器 bit1129 nginx
     Nginx的另一个常用的功能是作为负载均衡服务器。一个典型的web应用系统，通过负载均衡服务器，可以使得应用有多台后端服务器来响应客户端的请求。一个应用配置多台后端服务器，可以带来很多好处：   负载均衡的好处 增加可用资源 增加吞吐量 加快响应速度，降低延时 出错的重试验机制 Nginx主要支持三种均衡算法： round-robin l
  • jquery-validation备忘 白糖_ jquerycssF#Firebug
    留点学习jquery validation总结的代码：   function checkForm(){ validator = $("#commentForm").validate({// #formId为需要进行验证的表单ID errorElement :"span",// 使用"div"标签标记错误， 默认:&
  • solr限制admin界面访问（端口限制和http授权限制） ronin47 限定Ip访问
    solr的管理界面可以帮助我们做很多事情，但是把solr程序放到公网之后就要限制对admin的访问了。 可以通过tomcat的http基本授权来做限制，也可以通过iptables防火墙来限制。 我们先看如何通过tomcat配置http授权限制。 第一步： 在tomcat的conf/tomcat-users.xml文件中添加管理用户，比如： <userusername="ad
  • 多线程-用JAVA写一个多线程程序，写四个线程，其中二个对一个变量加1，另外二个对一个变量减1 bylijinnan java多线程
    public class IncDecThread { private int j=10; /* * 题目:用JAVA写一个多线程程序，写四个线程，其中二个对一个变量加1，另外二个对一个变量减1 * 两个问题： * 1、线程同步--synchronized * 2、线程之间如何共享同一个j变量--内部类 */ public static
  • 买房历程 cfyme
        2015-06-21: 万科未来城，看房子   2015-06-26: 办理贷款手续，贷款73万，贷款利率5.65=5.3675   2015-06-27: 房子首付,签完合同   2015-06-28，央行宣布降息 0.25，就2天的时间差啊，没赶上。   首付，老婆找他的小姐妹接了5万，另外几个朋友借了1-
  • [军事与科技]制造大型太空战舰的前奏 comsci 制造
           天气热了........空调和电扇要准备好..........        最近,世界形势日趋复杂化,战争的阴影开始覆盖全世界..........        所以,我们不得不关
  • dateformat dai_lm DateFormat
    "Symbol Meaning Presentation Ex." "------ ------- ------------ ----" "G era designator (Text) AD" "y year
  • Hadoop如何实现关联计算 datamachine mapreducehadoop关联计算
        选择Hadoop，低成本和高扩展性是主要原因，但但它的开发效率实在无法让人满意。     以关联计算为例。     假设：HDFS上有2个文件，分别是客户信息和订单信息，customerID是它们之间的关联字段。如何进行关联计算，以便将客户名称添加到订单列表中？   &nbs
  • 用户模型中修改用户信息时，密码是如何处理的 dcj3sjt126com yii
    当我添加或修改用户记录的时候对于处理确认密码我遇到了一些麻烦，所有我想分享一下我是怎么处理的。 场景是使用的基本的那些(系统自带)，你需要有一个数据表(user)并且表中有一个密码字段(password),它使用 sha1、md5或其他加密方式加密用户密码。 面是它的工作流程: 当创建用户的时候密码需要加密并且保存，但当修改用户记录时如果使用同样的场景我们最终就会把用户加密过的密码再次加密，这
  • 中文 iOS/Mac 开发博客列表 dcj3sjt126com Blog
      本博客列表会不断更新维护，如果有推荐的博客，请到此处提交博客信息。 本博客列表涉及的文章内容支持 定制化Google搜索，特别感谢 JeOam 提供并帮助更新。 本博客列表也提供同步更新的OPML文件（下载OPML文件），可供导入到例如feedly等第三方定阅工具中，特别感谢 lcepy 提供自动转换脚本。这里有导入教程。
  • js去除空格，去除左右两端的空格 蕃薯耀 去除左右两端的空格js去掉所有空格js去除空格
    js去除空格，去除左右两端的空格 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>&g
  • SpringMVC4零配置--web.xml hanqunfeng springmvc4
    servlet3.0+规范后，允许servlet，filter，listener不必声明在web.xml中，而是以硬编码的方式存在，实现容器的零配置。 ServletContainerInitializer：启动容器时负责加载相关配置 package javax.servlet; import java.util.Set; public interface ServletContainer
  • 《开源框架那些事儿21》：巧借力与借巧力 j2eetop 框架UI
    同样做前端UI，为什么有人花了一点力气，就可以做好？而有的人费尽全力，仍然错误百出？我们可以先看看几个故事。 故事1：巧借力，乌鸦也可以吃核桃 有一个盛产核桃的村子，每年秋末冬初，成群的乌鸦总会来到这里，到果园里捡拾那些被果农们遗落的核桃。 核桃仁虽然美味，但是外壳那么坚硬，乌鸦怎么才能吃到呢？原来乌鸦先把核桃叼起，然后飞到高高的树枝上，再将核桃摔下去，核桃落到坚硬的地面上，被撞破了，于是，
  • JQuery EasyUI 验证扩展 可怜的猫 jqueryeasyui验证
      最近项目中用到了前端框架-- EasyUI，在做校验的时候会涉及到很多需要自定义的内容，现把常用的验证方式总结出来，留待后用。   以下内容只需要在公用js中添加即可。   使用类似于如下： <input class="easyui-textbox" name="mobile" id="mobile&
  • 架构师之httpurlconnection----------读取和发送(流读取效率通用类) nannan408
    1.前言.    如题. 2.代码. /* * Copyright (c) 2015, S.F. Express Inc. All rights reserved. */ package com.test.test.test.send; import java.io.IOException; import java.io.InputStream
  • Jquery性能优化 r361251 JavaScriptjquery
    一、注意定义jQuery变量的时候添加var关键字 这个不仅仅是jQuery，所有javascript开发过程中，都需要注意，请一定不要定义成如下： $loading = $('#loading'); //这个是全局定义，不知道哪里位置倒霉引用了相同的变量名，就会郁闷至死的 二、请使用一个var来定义变量 如果你使用多个变量的话，请如下方式定义： . 代码如下: var page
  • 在eclipse项目中使用maven管理依赖 tjj006 eclipsemaven
    概览: 如何导入maven项目至eclipse中 建立自有Maven  Java类库服务器 建立符合maven代码库标准的自定义类库 Maven在管理Java类库方面有巨大的优势，像白衣所说就是非常“环保”。 我们平时用IDE开发都是把所需要的类库一股脑的全丢到项目目录下，然后全部添加到ide的构建路径中，如果用了SVN/CVS，这样会很容易就 把
  • 中国天气网省市级联页面 x125858805 级联
    1、页面及级联js <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> &l
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他