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)标签的命名，源网站的命名是比较有层次的，需要学习。

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

  • 为什么说仪式和习惯非常重要？ 章鱼老师zy
    这是章鱼姐第【40】篇原创文章，日更计划第【37/100】天。阅读张萌萌姐【精力管理手册】第【6/7】章。一阅读摘要这一章萌姐讲到了习惯的重要性，为什么说养成一个习惯很重要？如何养成一个好习惯？如何建立自己的仪式感？二金句精力管理最重要的是产生什么效果。当你想做却没有动力去做一件事情时，你就应该把它养成习惯。习惯可以帮我们创造稳定框架。对于那些特别考验意志的事情，我们应该先行后思。三思考题，萌姐讲
  • Django之Debug篇 菜鸟之编程 Djangodjangopython后端
    一、DebugToolBar基本使用1.1、概述Django框架的调试工具栏使用django-debug-toolbar库，是一组可配置的面板，显示有关当前请求/响应的各种调试信息，点击时，显示有关面板内容的更多详细信息。官方文档：DjangoDebugToolbar—DjangoDebugToolbar4.3.0documentation1.2、安装pipinstalldjango-debug-
  • 【嵌入式模块】步进电机使用总结 记录无知岁月 #嵌入式设备嵌入式硬件步进电机
    关于本博客  此前上了一门课《自动控制元件》，但是由于学时有限，讲到步进电机就不讲了，留下了一个小遗憾，导致需要使用步进电机时就有点懵，于是找了一篇博客，链接在这里，推荐具有电机知识（如直流电机，异步电机等）的朋友看，如果完全不懂，建议先啃书。
  • 直返APP所属的公司是何时成立的?它的发展历程和业务范围 好项目高省
    直返APP为我们带来了返利购物的便利，那么这款APP所属的公司是如何成立的呢？它的背后又有怎样的发展历程和业务范围呢？让我们一起探寻。【高省】APP（高佣金领导者）是一个自用省钱佣金高，分享推广赚钱多的平台，百度有几百万篇报道，运行三年，稳定可靠。高省APP，是2021年推出的平台，0投资，0风险、高省APP佣金更高，模式更好，终端用户不流失。高省是公认的返利最高的软件。古楼导师高省邀请码5558
  • OpenCV 如何使用 XML 和 YAML 文件的文件输入和输出 愚梦者 深度学习人工智能计算机视觉c++opencv
    返回：OpenCV系列文章目录（持续更新中......）上一篇：如何利用OpenCV4.9离散傅里叶变换下一篇:目标本文内容主要介绍：如何使用YAML或XML文件打印和读取文件和OpenCV的文本条目？如何对OpenCV数据结构做同样的事情？如何为您的数据结构执行此操作？使用OpenCV数据结构，例如cv::FileStorage,cv::FileNodeorcv::FileNodeIterato
  • 【真诚子】通晓鬼谷第七篇读书日记。 真诚子l通晓鬼谷
    今天把个人品牌，从193读到208页，书的内容质量出奇的高，尤其是这一段。对标学习法，找一个比自己强，或者你期望成为的人进行模仿性学习，对标学习，不是到处，去找人对标兵学习很多人的优点，或是学习自己认为好的方面，而是找准一个对标高手，然后全方位的学习这个人。我在做品牌咨询时就对标，学习了一个在国内很有名的行业顶尖大咖。我先找到他公司的方案，进行完全模仿，连PPT的排版都一样，而且我只参照他一个人的
  • 《金文成〈正蒙〉日记124。2020-11-9》 金吾生
    《金文成〈正蒙〉日记124。2020-11-9》今天是庚子丁亥丙子，九月廿四，2020年11月9日星期一。作者篇7【舜之孝，汤、武之武，虽顺逆不同，其为不幸均矣。】船山讲解说，顺，指的是舜的父亲最终受到感化，转变了态度，结局圆满之事；逆，指的是＂桀放、纣诛＂，即，商汤放桀，周武诛纣，都是采用暴力，不是感化方式，所以是逆。顺与逆，都是为了解决弊政，然其差异之大如此，然而，无论圆满还是遗憾，其实他们都
  • SQLite版本3中的文件锁定和并发(七） 代码工匠云 数据库SQLiteC与c++sqlitec++数据库
    返回：SQLite—系列文章目录上一篇：自己编译SQLite或将SQLite移植到新的操作系统（六）下一篇：SQLite—系列文章目录正文：1.0SQLite版本3中的文件锁定和并发SQLite版本3.0.0引入了新的锁定和日志功能旨在提高SQLite版本2的并发性的机制并减少作家的饥饿问题。新机制还允许交易的原子提交涉及多个数据库文件。本文档介绍新的锁定机制。目标受众是想要理解和/或修改的程序员
  • 上班族适合兼职的副业有哪些？分享五个适合上班族做的副业 高省张导师
    对于许多上班族来说，除了日常工作外，还有大量的空闲时间，因此兼职成为了一项非常普遍的选择。下面将向您介绍五个不错的兼职副业，每个兼职都可以很容易地从家中启动，同时也是一个短期见效的方式，可以让您很快增加收入。大家好，我是高省APP最大团队，【高省】是一个可省钱佣金高，能赚钱有收益的平台，百度有几百万篇报道，也期待你的加入。高省邀请码520888，注册送2皇冠会员，送万元推广大礼包。1、社交导购电商
  • 排序算法太多？常用排序都在这了，一篇文章总结和实现所有面试会考的排序算法（基于Python实现） 宇宙之一粟 不归路之Python#IT面试题收集与总结数据结构与算法算法数据结构排序算法pythonjava
    文章目录排序算法1.常见的排序算法1.1选择排序1.1.1思想1.1.2实现**1.1.3选择排序分析**1.2冒泡排序**1.2.1思想****1.2.2实现****1.2.3冒泡排序分析**1.3插入排序**1.3.1思想****1.3.2实现****1.3.3插入排序分析**1.4归并排序☆☆★**1.4.1思想****1.4.2实现****1.4.3归并排序分析**1.5快速排序☆★★**
  • 2018-12-02 子分小
    姓名：张颖公司：菲尔德国际英语【反省总结第146天，始于20180709今天是20181202】【知～学习】六项精进大纲背诵3遍每天十个单词坚持第181天每天学习一篇英文文章第94天英语流利说课程第71天学习30分钟【行～实践】一、修身：（对自己个人）步行5000步二、齐家：（对家庭和家人）无三、建功：（对工作)完成与Arti活动课和两节Demo准备开班事宜｛积善｝：发愿从2018年7月9日起1年
  • natapp内网穿透工具 万变不离其宗_8 工具其他
    1.NATAPP1分钟快速新手图文教程https://natapp.cn/article/natapp_newbie2.下载https://natapp.cn/#download3.使用本地配置文件config.ini，下载地址如下：https://natapp.cn/article/config_ini
  • 读后感——《我遥远的清平湾》 吴奕凯
    我遥远的清平湾是史铁生的作品。这是一篇散文集，里面第一篇就是“我遥远的清平湾”。里面主要讲述了史铁生在“文革”时，插队到了一个地方，名字叫“清平湾”。里面有一个老汉别人都叫他破老汉。可能是因为他太穷了——破与poor同音。史铁生就在插队时插到了破老汉的家中。破老汉的家中有几头牛。这几头牛跟史铁生发生了很多事情。比如说：有一个晚上，史铁生起来去给牛喂草。在黑暗中，发现有一头牛，仍然没有睡觉。他觉得很
  • 直返APP是由哪个团队开发的？这个团队有哪些特点和优势？ 日常购物技巧呀
    关于直返的创始人以及直返APP属于哪个公司，目前没有确切的公开信息。不过，一些网友认为，直返这种商业模式可能由多个不同的公司或团队所创造和运营。【高省】APP（高佣金领导者）是一个自用省钱佣金高，分享推广赚钱多的平台，百度有几百万篇报道，运行三年，稳定可靠。高省APP，是2021年推出的平台，0投资，0风险、高省APP佣金更高，模式更好，终端用户不流失。高省是公认的返利最高的软件。古楼导师高省邀请
  • 遗落的光阴 古诗风光
    第七篇，小明的学生时代。小明和他的同桌的共听一首歌的行为已经实现了。所以每次没事就和他的同桌一起畅听音乐，这也导致了一些场面都发生，一就是她的隔壁同桌时不时的鄙夷的眼光，二是他进一步加聚了他同桌对他的态度，他的同桌除了平时的听音乐交流之外，还增加了与他的交流。其中最关键的就是，因为他的同桌没事就与他的进行生活的交流。其中最关键的就是在一个不上课的周末小明独自一人回到了宿舍进行学习。而这时他的同桌带
  • 开始写吧 默默醉无为
    曾经无数次在心中纠结，要不要在双日更群坚持下去，曾经无数次差点就要放弃了，最后的心里微小的一点点挣扎让我还是坚持了下来。写吧，没有人能把你打垮——除了你自己。从1月份加入“007不写就出局”三月份加入“日更写作群”以来，我写到了现在，一共在上发表文章203篇。还有十天，我就能圆满的坚持到了一年。其中，有过写不出但又不得不写的尴尬，也有过虽写得不好但最终能完成的喜悦。虽然磕磕碰碰，但还是走过来了。这
  • 随心，日更第463天，第654篇原创 闲鱼玩家随心
    早上收到了一个好消息，不用居家隔离了。但是，要继续三天两检，健康码才能变绿。看着这变化多端的防疫政策，我沉默了许久。想了想，货还是要囤的。因为你不知道什么时候城市就会静止。看到各种各样的说法，各种各样的谣言，我也懒得分辨真假了。这个时刻，更多的还是应该关注自身。锻炼身体了没有，赚钱了没有，学习了没有。因为这些东西才是跟我们自己息息相关的，至于其他不必要的信息还是屏蔽掉好一些。从上个月开始，就在想各
  • 一个可以随时被打扰的人 南询yi
    今日分享十点读书一篇推文，有个可以随时打扰的人真好。在这个世界上，有没有一个你可以随时打扰的人？当你累了的时候，可以彼此依靠；当你想哭的时候，可以借你肩膀；当你开心的时候，可以一起大笑。正因为有这样的人存在，我们才不会觉得孤立无援。他们就像无坚不摧的铠甲，时刻保护着我们，帮我们抵御痛苦、驱散阴霾。无论是在茫茫戈壁，还是艰难坎坷的人生，有一个人能随时可以打扰，都是一种莫大的幸福。在这个人面前，我们不
  • 亲子日记第110篇 爱水的鱼鱼
    今天孩子们在学校提前过元旦，老师一一给表演节目的孩子们拍了视频，分享到群里让我们也能看节目。谢谢老师的用心，辛苦了！下午孩子们都放学回家，爸爸提议要请我们吃饭，提前过元旦，一致通过。吃饭回到家爸爸说，吃好喝好了你们也该做作业了。老大老二各自回屋去写作业了，而且很专心，老二做了两张试题一张口算，速度不用说比平时快错的还少。问我还给她点啥题做做，我说不用做了，洗刷睡觉去，明天还要早起上架子鼓课。时间就
  • 济公的曾祖和达观禅师的这段对话虽短，读完开悟人生 水如天如水
    原创水如天如水古今小茶馆2023-05-0607:29发表于山东点击蓝字·关注我们古今小茶馆一杯香茗，几个知己，一段历史，几度回忆！243篇原创内容公众号李端愿在宋仁宗时被任命为太子太保。他除了尽心竭力地教育太子之外，自己还经常在空闲的时候，听禅礼佛。他有一个好朋友叫达观禅师，是一位得道高僧。有什么迷惑，李端愿都会第一时间找到他来答疑解惑。有一次达观禅师对李端愿说：“佛祖在本无意义的生命中，发现了
  • 【前端学习——js篇】7.函数缓存 笔下无竹墨下有鱼 前端学习前端学习javascript
    具体见：https://github.com/febobo/web-interview7.函数缓存函数缓存，就是将函数运算过的结果进行缓存本质上就是用空间（缓存存储）换时间（计算过程）常用于缓存数据计算结果和缓存对象。其实现主要通过闭包、柯里化和高阶函数。下面主要介绍下柯里化：①柯里化柯里化（currying)是一种函数式编程的概念，指的是将一个带有多个参数的函数转换成一系列只接受一个参数的函数的
  • OpenCV（一个C++人工智能领域重要开源基础库） 简介 愚梦者 OpenCV人工智能人工智能opencvc++图像处理计算机视觉开源
    返回：OpenCV系列文章目录（持续更新中......）上一篇：OpenCV4.9.0配置选项参考下一篇：OpenCV4.9.0开源计算机视觉库安装概述引言：OpenCV（全称OpenSourceComputerVisionLibrary）是一个基于开放源代码发行的跨平台计算机视觉库，可以用来进行图像处理、计算机视觉和机器学习等领域的开发。该库由英特尔公司于1999年开始开发，最初是为了加速处理器
  • 【循环神经网络rnn】一篇文章讲透 CX330的烟花 rnn人工智能深度学习算法python机器学习数据结构
    目录引言二、RNN的基本原理代码事例三、RNN的优化方法1长短期记忆网络（LSTM）2门控循环单元（GRU）四、更多优化方法1选择合适的RNN结构2使用并行化技术3优化超参数4使用梯度裁剪5使用混合精度训练6利用分布式训练7使用预训练模型五、RNN的应用场景1自然语言处理2语音识别3时间序列预测六、RNN的未来发展七、结论引言众所周知，CNN与循环神经网络（RNN）或生成对抗网络（GAN）等算法结
  • 【PHP】通过PHP开启/暂停Apache、MySQL或其他服务 下页、再停留 PHPphpapachemysql
    目录一、前言二、代码一、前言有些时候我们需要开启或暂停一些服务，比如说开启Apach或暂停MySQL服务等，最近工作中也开发了这方面的功能，记录下来怎样使用PHP语言来开启或暂停Apache、MySQL服务的运行状态。这种方法也适用其他服务。如果想了解怎么实时监控服务的运行状态，可以看上一篇文章【PHP】通过PHP实时监控Apache、MySQL服务运行状态-CSDN博客二、代码有三个参数需要根据
  • 新手在哪个平台写作容易赚稿费，写作投稿的平台 配音就业圈
    一、新手写作容易赚稿费的平台对于新手写手来说，选择一个容易赚取稿费的写作平台是非常重要的。一些知名的写作平台，如知乎、、今日头条等，都提供了赚取稿费的机会。此外，还有一些专门的写作平台，如稿定、创客贴等，也是新手写手容易获得稿费的选择。兼职副业推荐公众号，配音新手圈，声优配音圈，新配音兼职圈，配音就业圈，鼎音副业，有声新手圈，每天更新各种远程工作与在线兼职，职位包括：写手、程序开发、剪辑、设计、翻
  • 《唐阿姨的电脑》唐晓莉林浩（完结篇）全文免费阅读【笔趣阁】 小说推书
    《唐阿姨的电脑》唐晓莉林浩（完结篇）全文免费阅读【笔趣阁】主角：唐晓莉林浩简介：这天中午，林浩接到了唐晓莉的电话，说家里电脑坏了，问他有没有时间过去帮忙看一眼。可以关注微信公众号【枫叶赏文】去回个书號【唐晓莉】，即可免费阅读【唐阿姨的电脑】小说全文！这天中午，林浩接到了唐晓莉的电话，说家里电脑坏了，问他有没有时间过去帮忙看一眼。“当然有了，我今天没课，唐阿姨你在家等我，十分钟就到。”说完，林浩立马
  • 京东特价版是什么意思？有哪些模块？ 高省APP
    京东平台有推出京东特价版，类似于淘宝平台推出的淘宝特价版，大家可以在京东特价版买到想要的产品，大家知道京东特价版是什么意思吗?下面为大家进行相关的解答。高省APP（帮朋友一起省）佣金更高，模式更好，终端用户不流失。【高省】是一个自用省钱佣金高，分享推广赚钱多的平台，百度有几百万篇报道，也期待你的加入。高省邀请码518518，注册送2皇冠会员，送万元推广大礼包，教你如何1年做到百万团队。京东特价版是
  • 酒微醺 枣园草
    图片发自App酒微醺，状态刚刚好!既不会胡言乱语，又能自我约束；不会丑态百出，又能保持着一份清醒。外边的舞曲又响起来了。由于陪老公喝了少许酒，不想去跳舞了。女儿今天期中考试，没夜自习，正在小屋里写作业。柔和的灯光洒满卧室，照着她伏案认真学习的样子。昨天，女儿让看了家长群里一位家长分享的一篇给孩子最好的陪伴的文章。文中说，孩子需要我们陪伴的时间并不多了，当上高中后，你想陪伴人家也没机会了，以后更是少
  • 配音怎么学，配音投稿有哪些平台 配音新手圈
    一、配音学习的方法为了学习配音技巧，可以采取以下方法：1.注册配音学习培训班，跟随专业老师学习基本的配音知识和技巧。兼职副业推荐公众号，配音新手圈，声优配音圈，新配音兼职圈，配音就业圈，鼎音副业，有声新手圈，每天更新各种远程工作与在线兼职，职位包括：写手、程序开发、剪辑、设计、翻译、配音、无门槛、插画、翻译、等等。。。每日更新兼职。2.多观察、模仿优秀的配音演员，学习他们的表演风格和声音技巧。3.
  • 在线云客服兼职，网上客服兼职在家怎么做?怎么去应聘? 声优配音圈
    现在的年轻人越来越注重自主、自由，也更加注重个人时间的规划。在家兼职是符合这种趋势的一种方式，而阿里巴巴云客服作为一种在家兼职，以其稳定和高效获得了一定的关注度。下面兼职网给大家详细介绍一下。兼职副业推荐公众号，配音新手圈，声优配音圈，新配音兼职圈，配音就业圈，鼎音副业，有声新手圈，每天更新各种远程工作与在线兼职，职位包括：写手、程序开发、剪辑、设计、翻译、配音、无门槛、插画、翻译、等等。。。每日
  • 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其他