ぃ咔哇依°ヽ
ぃ咔哇依°ヽ

20231107-前端学习炫酷菜单效果和折叠侧边栏

炫酷菜单效果

20231107-前端学习炫酷菜单效果和折叠侧边栏_第1张图片

代码

DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>炫酷菜单效果title>
  <script src="https://kit.fontawesome.com/d37465fc7c.js" crossorigin="anonymous">script>
  <style>
    * {
      margin: 0;
      padding: 0;
      font-family: sans-serif;
      list-style: none;
      text-decoration: none;
    }

    .middle {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }

    .menu {
      width: 300px;
      border-radius: 8px;
      overflow: hidden;
    }

    .item {
      border-top: 1px solid #2980b9;
      overflow: hidden;
    }

    .btn {
      display: block;
      padding: 16px 20px;
      background: #3498db;
      position: relative;
      color: white;
    }

    .btn::before {
      content: "";
      position: absolute;
      width: 14px;
      height: 14px;
      background: #3498db;
      left: 20px;
      bottom: -7px;
      transform: rotate(45deg);
    }

    .btn i {
      margin-right: 10px;
    }

    .smenu {
      background: #333;
      overflow: hidden;
      transition: max-height 0.3s;
      max-height: 0;
    }

    .smenu a {
      display: block;
      padding: 16px 26px;
      color: white;
      font-size: 14px;
      margin: 4px 0;
      position: relative;
    }

    .smenu a::before {
      content: "";
      position: absolute;
      width: 6px;
      height: 100%;
      background: #3498db;
      left: 0;
      top: 0;
      transition: 0.3s;
      opacity: 0;
    }

    .smenu a:hover::before {
      opacity: 1;
    }

    .item:target .smenu {
      max-height: 10em;
    }
  style>
head>

<body>
  <div class="middle">
    <div class="menu">
      <li class="item" id="profile">
        <a href="#profile" class="btn">
          <i class="fa-solid fa-user">i>Profile
        a>
        <div class="smenu">
          <a href="">Postsa>
          <a href="">Picturea>
        div>
      li>

      <li class="item" id="messages">
        <a href="#messages" class="btn">
          <i class="fa-solid fa-envelope">i>Messages
        a>
        <div class="smenu">
          <a href="">newa>
          <a href="">Senta>
          <a href="">Spama>
        div>
      li>

      <li class="item" id="settings">
        <a href="#settings" class="btn">
          <i class="fa-solid fa-gear">i>Settings
        a>
        <div class="smenu">
          <a href="">Passworda>
          <a href="">Languagea>
        div>
      li>

      <li class="item">
        <a href="" class="btn">
          <i class="fa-solid fa-right-from-bracket">i>Logout
        a>
      li>
    div>
  div>
body>

html>

折叠侧边栏

20231107-前端学习炫酷菜单效果和折叠侧边栏_第2张图片

代码

DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>折叠侧边栏title>
  <script src="https://kit.fontawesome.com/d37465fc7c.js" crossorigin="anonymous">script>
  <style>
    * {
      margin: 0;
      padding: 0;
    }

    a {
      text-decoration: none;
    }

    li {
      list-style: none;
    }

    body {
      font-family: Arial, Helvetica, sans-serif;
      background-color: #f4f4f4;
    }

    .navbar {
      background-color: #3b5998;
      overflow: hidden;
      height: 63px;
    }

    .navbar a {
      float: left;
      display: block;
      color: #f2f2f2;
      text-align: center;
      font-size: 17px;
      padding: 14px 16px;
    }

    .navbar ul {
      margin: 8px 0 0 0;
    }

    .open-side i {
      padding-top: 18px;
    }

    .navbar a:hover {
      background-color: #ddd;
      color: #000;
    }

    .side-nav {
      height: 100%;
      width: 0;
      position: fixed;
      z-index: 1;
      top: 0;
      left: 0;
      background-color: #111;
      opacity: 0.8;
      overflow-x: hidden;
      padding-top: 60px;
      transition: 0.5s;
    }

    .side-nav a {
      padding: 10px 10px 10px 30px;
      font-size: 22px;
      color: #ccc;
      display: block;
      transition: .3s;
    }

    .side-nav a:hover {
      color: orange;
    }

    .side-nav .btn-close {
      position: absolute;
      top: 0;
      right: 22px;
      font-size: 36px;
    }

    #content {
      transition: margin-left .5s;
      padding: 20px;
    }

    @media(max-width:568px) {
      .navbar ul {
        display: none;
      }
    }

    /* @media(min-width:568px) {
      .open-side {
        display: none;
      }
    } */
  style>
head>

<body>
  <nav class="navbar">
    <span class="open-side">
      <a href="#" onclick="openSideMenu()">
        <i class="fa-solid fa-bars fa-2xl">i>
      a>
    span>
    <ul class="navbar-nav">
      <li><a href="#">Homea>li>
      <li><a href="#">Abouta>li>
      <li><a href="#">Servicesa>li>
      <li><a href="#">Contacta>li>
    ul>
  nav>

  <div id="side-menu" class="side-nav">
    <a href="#" class="btn-close" onclick="closeSideMenu()">×a>
    <a href="#">Homea>
    <a href="#">Abouta>
    <a href="#">Servicesa>
    <a href="#">Contacta>
  div>

  <div id="content">
    <h1>你好，世界！h1>
  div>

  <script>
    xySideMenu = document.getElementById("side-menu");
    xyContent = document.getElementById("content");

    function openSideMenu() {
      xySideMenu.style.width = "250px";
      xyContent.style.marginLeft = "250px";
    }

    function closeSideMenu() {
      xySideMenu.style.width = "0";
      xyContent.style.marginLeft = "0";
    }
  script>
body>

html>

你可能感兴趣的:(前端,前端,学习,css)

  • Jarslink 是一个 SOFA 方舟插件，用于管理多应用部署 后端java
    前言大家好，我是老马。sofastack其实出来很久了，第一次应该是在2022年左右开始关注，但是一直没有深入研究。最近想学习一下SOFA对于生态的设计和思考。sofaboot系列SOFABoot-00-sofaboot概览SOFABoot-01-蚂蚁金服开源的sofaboot是什么黑科技？SOFABoot-02-模块化隔离方案SOFABoot-03-sofaboot介绍SOFABoot-04-快
  • Electron打包文件生成.exe文件打开即可使用 糕冷小美n electronjavascript前端
    1、Electron打包，包括需要下载的内容和环境配置步骤注意：Electron是一个使用JavaScript、HTML和CSS构建跨平台桌面应用程序的框架首先需要电脑环境有Node.js和npm我之前的文章有关nvm下载node的说明也可以去官网下载检查是否有node和npm环境命令node-vnpm-v输出版本号，说明安装成功2、创建Electron项目2.1创建项目目录打开命令行工具，创建一
  • CCNP之IGP学习笔记（2022） 码龄4年 审核中 笔记OSPFRIPEIGRPIGPCCNP
    evecommunityedition2.0.3-92_v1.4.1.ovaOVF（OpenVirtualizationFormat：开放虚拟化格式）和OVA（OpenVirtualizationAppliance：开放虚拟化设备）appliance器具collaborative合作的；协力完成的translation翻译；译文；译本；转化CollaborativeTranslationFrame
  • 学习-Java常用类之Calendar类 AIains Educoder—Javajava
    第1关：学习-Java常用类之Calendar类任务描述相关知识编程要求测试说明任务描述本关任务：获取给定年月的最后一天。相关知识我们通过之前的学习已经能够格式化并创建一个日期对象了，但是我们如何才能设置和获取日期数据的特定部分呢，比如说小时，日，或者分钟?我们又如何在日期的这些部分加上或者减去值呢?calendar类是一个抽象类，是Java日期处理的核心类之一。Calendar类为操作日历字段，
  • 高效快速教你DeepSeek如何进行本地部署并且可视化对话 大富大贵7 程序员知识储备1程序员知识储备2程序员知识储备3经验分享
    科技文章：高效快速教你DeepSeek如何进行本地部署并且可视化对话摘要：随着自然语言处理（NLP）技术的进步，DeepSeek作为一款基于深度学习的语义搜索技术，广泛应用于文本理解、对话系统及信息检索等多个领域。本文将探讨如何高效快速地在本地部署DeepSeek，并结合可视化工具实现对话过程的监控与分析。通过详尽的步骤、案例分析与代码示例，帮助开发者更好地理解和应用DeepSeek技术。同时，本
  • 【嵌入式学习2】指针 - 数组 XYN5114 嵌入式学习学习笔记嵌入式硬件c语言
    目录##概述##指针###指针特点##指针变量###指针变量特点##区别##指针变量的使用定义指针变量时：使用指针变量时：##通过指针间接修改变量的值##指针大小指针大小与数据类型无关：无论指针指向什么类型的数据（int、char、double等），指针本身的大小只取决于系统的位数（32位或64位）。##指针步长###指针步长的计算方式##空指针和野指针##多级指针##指针与常量##函数参数传递内
  • 机器学习——分类、回归、聚类、LASSO回归、Ridge回归（自用） 代码的建筑师 模型学习模型训练机器学习机器学习分类回归正则化项LASSORidge朴素
    纠正自己的误区：机器学习是一个大范围，并不是一个小的方向，比如：线性回归预测、卷积神经网络和强化学都是机器学习算法在不同场景的应用。机器学习最为关键的是要有数据，也就是数据集名词解释：数据集中的一行叫一条样本或者实例，列名称为特征或者属性。样本的数量称为数据量，特征的数量称为特征维度机器学习常用库：Numpy和sklearn朴素的意思是特征的各条件都是相互独立的机器学习（模型、策略、算法）损失函数
  • PHP框架为基础的购物平台设计思路分步骤说明 星糖曙光 后端语言（nodejavascriptvue等等）学习课程设计vue.jspythonphp
    以下是以PHP框架为基础的购物平台设计思路分步骤说明：一、技术选型阶段技术栈={后端框架：Laravel/Yii2（提供ORM、路由、中间件支持）前端框架：Vue.js/React（可选SPA方案）数据库：MySQL8.0+（事务型数据存储）缓存：Redis（会话/商品缓存）队列：RabbitMQ（异步处理订单）\text{技术栈}=\begin{cases}后端框架：Laravel/Yii2（提
  • 致现在的我与未来的我：编程长河中的摆渡手札 星糖曙光 后端语言（nodejavascriptvue等等）笔记学习深度学习人工智能网络
    致现在的我与未来的我：编程长河中的摆渡手札一、技术积累：从萤火微光到星河初现（约3000字）前端的启蒙：HTML/CSS与"所见即所得"的魔法“代码是诗，但诗未必能成为产品”，初学编程时，我如《禅与摩托车维修艺术》中追寻"良质"的探索者，在W3School的教程中笨拙地敲下第一行。记得仿写京东首页时，一个浮动布局的错位让我通宵调试，最终发现竟是未闭合的标签——这让我想起《代码大全》中的警示：“计算
  • 若依集成knife4j实现swagger文档增强 Roc-xb knife4j
    knife4j的前身是swagger-bootstrap-ui，为了契合微服务的架构发展,由于原来swagger-bootstrap-ui采用的是后端Java代码+前端Ui混合打包的方式,在微服务架构下显的很臃肿,因此项目正式更名为knife4j。目录一、单体版本1、ruoyi-admin\pom.xml模块添加整合依赖2、SwaggerController.java修改跳转访问地址二、前后端分离
  • RK平台下Buildroot驱动编译环境入门 ItJavawfc RK系统-驱动驱动学习KernelUbuntuBuildroot
    提示：低配置电脑下驱动编译环境搭建，驱动学习环境准备文章目录目的需求环境Ubuntu18Desk桌面开发环境Buildroot编译环境基本要求个人环境VM环境配置+Buildroot编译环境配置Buildroot编译总结目的搭建驱动开发编译环境硬件环境要求不达标如何进行配置规避，使编译环境编译OK为后续自己开发工作中，学习环境做一个简单的指导需求这里我需要搭建的环境是Ubuntu上面用Linux源
  • C++在线OJ负载均衡项目 平凡的小y c++开发语言
    1.演示项目项目源码链接：2.项目所用技术和开发环境所用技术C++STL标准库Boost准标准库(字符串切割)cpp-httplib第三方开源网络库ctemplate第三方开源前端网页渲染库jsoncpp第三方开源序列化、反序列化库负载均衡设计MySQLCconnectAce前端在线编辑器html/css/js/jquery/ajax开发环境Ubuntu云服务器vscodeMysqlWorkben
  • 量化交易系统中如何处理机器学习模型的训练和部署？ openwin_top 量化交易系统开发机器学习人工智能量化交易
    microPythonPython最小内核源码解析NI-motion运动控制c语言示例代码解析python编程示例系列python编程示例系列二python的Web神器Streamlit如何应聘高薪职位量化交易系统中，机器学习模型的训练和部署需要遵循一套严密的流程，以确保模型的可靠性、性能和安全性。以下是详细描述以及相关的示例：1.数据收集和预处理数据收集在量化交易中，数据是最重要的资产。收集的数
  • 不懂英语可以学编程吗?,不懂英文可以学编程吗 P5688346 人工智能
    大家好，给大家分享一下英语不好能学python编程吗，很多人还不知道这一点。下面详细解释一下。现在让我们来看看！Sourcecodedownload:本文相关源码提到人工智能，就不得不提Python编程语言，大多数人觉得编程语言肯定会涉及到很多代码，满屏的英文字母，想想就头疼，觉得自己不会英语，肯定学不好Python，但是不会英语到底能不能够学习Python呢，下面小编给大家分析分析。其实各位想要
  • 大屏自适应终极方案：基于比例缩放的完美适配实践（Vue3版） FFF-X html5javascript
    需求背景在数据可视化大屏开发中，我们常面临这样的挑战：如何让1920*1080的设计稿在不同分辨率设备上完美呈现？传统的响应式布局难以应对复杂的大屏元素排布，本文介绍一种基于CSS3变换的终极适配方案实现思路本方案的核心是动态比例缩放，通过以下关键步骤实现：基准比例锁定：基于设计稿宽高比（16:9）建立基准比例视口实时检测：通过resize事件监听窗口变化智能比例判断：当视口更宽时：保持高度基准，
  • Font Awesome 的使用 FFF-X
    第一种直接使用命令npminstallfont-awesome--save进行安装，安装成功后里面包含样式和字体，然后直接引入样式就可以了入口js中引入import'font-awesome/css/font-awesome.min.css'然后就可以使用了，例如下面这样第二种cdn要使用FontAwesome图标，请在HTML页面的部分中添加以下行：1、国内推荐CDN：2、海外推荐CDN推荐第二
  • C#基础学习（二）C#数组生存手册：从入门到“血压拉满“的奇妙旅程 FAREWELL00075 c#学习开发语言数组Array
    作为一只C#萌新，当你试图用数组装下整个世界时，系统可能会温柔地弹出一句**"Indexwasoutsidetheboundsofthearray."**。别慌！这份求生指南将用段子教你玩转数组一、数组是什么数组简单来说就是由相同元素组成的一个集合，数组里面不一定是数，还可能是bool,string等类型组成的集合。那么他有些什么特点呢：本质：装着相同类型元素的集装箱（比如一箱肥宅快乐水）特性：长
  • 笔记：代码随想录算法训练营day60：并查集理论基础、寻找存在的路径 jingjingjing1111 笔记
    本文为学习并查集理论基础|代码随想录、代码随想录过程中的思考find是找的顶头上司，而不是当前上司，最后怎么也得找到一个顶头上司的上司是自己，要不然这个结构也不成立使用issame替换会使被操作者为当前节点，而非根节点。join(u,v)的功能为将v的根节点挂到u的根节点下模拟过程可以看出，join中的find中的路径压缩要在长度大于2（路径大于1）的时候才会体现出来107.寻找存在的路径卡码网题
  • 计算机基础：编码04，认识反码和补码 水饺编程 MFC学习笔记Win32学习笔记windowsc++mfcc语言
    专栏导航本节文章分别属于《Win32学习笔记》和《MFC学习笔记》两个专栏，故划分为两个专栏导航。读者可以自行选择前往哪个专栏。（一）WIn32专栏导航上一篇：计算机基础：编码03，根据十进制数，求其原码回到目录下一篇：无（二）MFC专栏导航上一篇：计算机基础：编码03，根据十进制数，求其原码回到目录下一篇：无本节前言在前两节，我讲解了关于原码的知识。本节，我来讲解反码和补码。在学习本节之前，你需
  • 【access开发】导入excel 并生成表 Access开发易登软件 vbaAccess开发Excelhtmlvbaaccessexcel前端access数据库低代码
    hi，大家好呀！最近天气越来越暖了，在这个春暖花开的季节了，每天心情应该都是美美的，正所谓一年之计在于春，在这个美好的季节，大家一起努力学习学习吧！那我们来看看今天学点啥呢？大家在刚接触access时，很多都是excel的高手，学习的过程中，总会想着，怎么把现在的excel数据导入到access，那这个时候该怎么来操作呢？如果是新手，那肯定是导入excel就可以了，那如果你是一个爱show技术的e
  • Android Jetpack 应用架构指南 小李子学编程 Android开发文档指南androidandroidjetpack学习
    AndroidJetpack应用架构指南本指南涵盖Android应用开发的最佳实践和推荐架构，助力开发者构建健壮高效的应用程序。。前置要求本文假设您已具备Android框架基础知识。若需系统学习Android开发，建议先完成《Android基础知识》目录新架构设计背景移动应用交互特性核心架构原则分离关注点数据模型驱动界面单一数据源单向数据流分层架构设计界面层数据层领域层依赖管理方案工程实践指南参考
  • 使用Python构建去中心化预测市场：从概念到实现 Echo_Wish Python！实战！python去中心化开发语言
    使用Python构建去中心化预测市场：从概念到实现大家好，我是Echo_Wish。今天，我们将深入探讨一个前沿的区块链应用——去中心化预测市场，并学习如何使用Python来构建一个简易的预测市场平台。预测市场是基于市场参与者对未来事件的预测来产生结果的地方，通常被用来预测政治事件、金融市场走向、体育比赛结果等。传统的预测市场如Augur、Polymarket等，基于去中心化平台，利用区块链技术确保
  • RocketMQ学习-Springboot整合RocketMQ wechatt_fee1024 面试mavenspringbootjava
    SpringBoot整合RocketMQ需要注意的是SpringBoot的starter集成包时，要注意版本。因为SpringBoot集成的RocketMQ的starter依赖由Spring社区提供，迭代比较快，版本之间的差异还是比较大的。可能版本不同，就导致使用的时候出现错误。maven依赖,直接把我的maven工程的配置放到这里了。普通消息maven工程创建我直接创建了一个空的maven工程，
  • rocketmq-client 4.3.0 在springboot中的使用 Myueye JAVAjava
    rocketmq-client4.3.0在springboot中的使用1、导入依赖2、配置文件属性3、编写配置类4、使用测试5、结果5.1RocketMQ后台显示5.2前端页面5.3后端后台1、导入依赖org.apache.rocketmqrocketmq-client4.3.02、配置文件属性mq.nameserverAdd=ip地址:9876mq.topic=top1(topic名称)mq.p
  • 回答我！！！如何用“快递分拣”讲明白OSI五层模型？ 茫忙然 计算机网络网络
    刚开始学习计算机网络时，会比较难理解计算机网络的五层协议，毕竟确实挺抽象的，接下来我用寄快递的过程来类比计算机网络的五层协议（物理层、数据链路层、网络层、传输层、应用层），帮助大家理解每一层的功能和作用。1.物理层（PhysicalLayer）——交通工具和道路快递中的比喻：卡车、飞机、轮船等运输工具，以及高速公路、铁路、航线等物理路径。功能：负责将包裹（数据）从一个地点物理传输到另一个地点，不关
  • Python基于深度学习的动物图片识别技术的研究与实现 Java老徐 Python毕业设计python深度学习开发语言深度学习的动物图片识别技术Python动物图片识别技术
    博主介绍：✌程序员徐师兄、7年大厂程序员经历。全网粉丝12w+、csdn博客专家、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌文末获取源码联系精彩专栏推荐订阅不然下次找不到哟2022-2024年最全的计算机软件毕业设计选题大全：1000个热门选题推荐✅Java项目精品实战案例《100套》Java微信小程序项目实战《100套》感兴趣的可以先收藏起来，还有大家
  • 【Spark】查询优化中分区（Partitioning）和分桶（Bucketing）是什么关系？什么时候应当分区，什么时候应当分桶？ petrel2015 spark大数据分布式数据库
    在学习Spark的过程中，分区和分桶乍一看很像，都能为了计算加速，但是仔细一想，一查还是有些差异的，甚至说差异很大。那么具体有什么差异点，有什么相同点。我做出了如下的整理，供大家参考，欢迎指正。相同点分区（Partitioning）和分桶（Bucketing）在很多方面具有相似性，它们都是用于优化大数据查询性能的技术数据划分的目的：优化查询性能分区和分桶的核心目标是通过将数据分割成更小的逻辑单元来
  • 【深度学习与大模型基础】第7章-特征分解与奇异值分解 lynn-66 深度学习与大模型基础算法机器学习人工智能
    一、特征分解特征分解（EigenDecomposition）是线性代数中的一种重要方法，广泛应用于计算机行业的多个领域，如机器学习、图像处理和数据分析等。特征分解将一个方阵分解为特征值和特征向量的形式，帮助我们理解矩阵的结构和性质。1.特征分解的定义对于一个n×n的方阵A，如果存在一个非零向量v和一个标量λ，使得：则称λ为矩阵A的特征值，v为对应的特征向量。特征分解将矩阵A分解为：其中：Q是由特征
  • 六十天前端强化训练之第二十九天之深入解析：从零构建企业级Vue项目的完整指南 编程星辰海 #前端前端Vue项目
    =====欢迎来到编程星辰海的博客讲解======看完可以给一个免费的三连吗，谢谢大佬！目录一、Vite核心原理与开发优势二、项目创建深度解析三、配置体系深度剖析四、企业级项目架构设计五、性能优化实战六、开发提效技巧七、质量保障体系八、扩展阅读推荐一、Vite核心原理与开发优势1.1为什么选择Vite？Vite采用现代浏览器原生ES模块系统（NativeESM）作为开发服务器，颠覆了传统打包工具的
  • 【论文阅读】Persistent Homology Captures the Generalization of Neural Networks Without A Validation Set 开心星人 论文阅读论文阅读
    将神经网络表征为加权的无环图，直接根据模型的权重矩阵构造PD。计算相邻batch的权重矩阵PD之间的距离。比较同调收敛性与神经网络的验证精度变化趋势摘要机器学习从业者通常通过监控模型的某些指标来估计其泛化误差，并在训练数值收敛之前停止训练，以防止过拟合。通常，这种误差度量或任务相关的指标是通过一个验证集（holdoutset）来计算的。因为这些数据没有直接用于更新模型参数，通常假设模型在验证集上的
  • SAX解析xml文件 小猪猪08 xml
    1.创建SAXParserFactory实例 2.通过SAXParserFactory对象获取SAXParser实例 3.创建一个类SAXParserHander继续DefaultHandler，并且实例化这个类 4.SAXParser实例的parse来获取文件     public static void main(String[] args) { //
  • 为什么mysql里的ibdata1文件不断的增长？ brotherlamp linuxlinux运维linux资料linux视频linux运维自学
    我们在 Percona 支持栏目经常收到关于 MySQL 的 ibdata1 文件的这个问题。 当监控服务器发送一个关于 MySQL 服务器存储的报警时，恐慌就开始了 —— 就是说磁盘快要满了。 一番调查后你意识到大多数地盘空间被 InnoDB 的共享表空间 ibdata1 使用。而你已经启用了 innodbfileper_table，所以问题是： ibdata1存了什么？ 当你启用了 i
  • Quartz-quartz.properties配置 eksliang quartz
    其实Quartz JAR文件的org.quartz包下就包含了一个quartz.properties属性配置文件并提供了默认设置。如果需要调整默认配置，可以在类路径下建立一个新的quartz.properties，它将自动被Quartz加载并覆盖默认的设置。   下面是这些默认值的解释 #-----集群的配置 org.quartz.scheduler.instanceName =
  • informatica session的使用 18289753290 workflowsessionlogInformatica
    如果希望workflow存储最近20次的log，在session里的Config  Object设置，log  options做配置，save  session log :sessions  run  ;savesessio log for  these runs:20 session下面的source 里面有个tracing 
  • Scrapy抓取网页时出现CRC check failed 0x471e6e9a != 0x7c07b839L的错误 酷的飞上天空 scrapy
    Scrapy版本0.14.4 出现问题现象： ERROR: Error downloading <GET http://xxxxx  CRC check failed   解决方法   1.设置网络请求时的header中的属性'Accept-Encoding': '*;q=0'   明确表示不支持任何形式的压缩格式，避免程序的解压
  • java Swing小集锦 永夜-极光 java swing
    1.关闭窗体弹出确认对话框   1.1   this.setDefaultCloseOperation (JFrame.DO_NOTHING_ON_CLOSE);   1.2   this.addWindowListener ( new WindowAdapter () { public void windo
  • 强制删除.svn文件夹 随便小屋 java
              在windows上，从别处复制的项目中可能带有.svn文件夹，手动删除太麻烦，并且每个文件夹下都有。所以写了个程序进行删除。因为.svn文件夹在windows上是只读的，所以用File中的delete()和deleteOnExist()方法都不能将其删除，所以只能采用windows命令方式进行删除
  • GET和POST有什么区别？及为什么网上的多数答案都是错的。 aijuans get post
        如果有人问你，GET和POST，有什么区别？你会如何回答？ 我的经历      前几天有人问我这个问题。我说GET是用于获取数据的，POST，一般用于将数据发给服务器之用。     这个答案好像并不是他想要的。于是他继续追问有没有别的区别？我说这就是个名字而已，如果服务器支持，他完全可以把G
  • 谈谈新浪微博背后的那些算法 aoyouzi 谈谈新浪微博背后的那些算法
    本文对微博中常见的问题的对应算法进行了简单的介绍，在实际应用中的算法比介绍的要复杂的多。当然，本文覆盖的主题并不全，比如好友推荐、热点跟踪等就没有涉及到。但古人云“窥一斑而见全豹”，希望本文的介绍能帮助大家更好的理解微博这样的社交网络应用。 微博是一个很多人都在用的社交应用。天天刷微博的人每天都会进行着这样几个操作：原创、转发、回复、阅读、关注、@等。其中，前四个是针对短博文，最后的关注和@则针
  • Connection reset 连接被重置的解决方法 百合不是茶 java字符流连接被重置
    流是java的核心部分,,昨天在做android服务器连接服务器的时候出了问题,就将代码放到java中执行,结果还是一样连接被重置   被重置的代码如下;   客户端代码; package 通信软件服务器; import java.io.BufferedWriter; import java.io.OutputStream; import java.io.O
  • web.xml配置详解之filter bijian1013 javaweb.xmlfilter
    一.定义 <filter> <filter-name>encodingfilter</filter-name> <filter-class>com.my.app.EncodingFilter</filter-class> <init-param> <param-name>encoding<
  • Heritrix Bill_chen 多线程xml算法制造配置管理
    作为纯Java语言开发的、功能强大的网络爬虫Heritrix，其功能极其强大，且扩展性良好，深受热爱搜索技术的盆友们的喜爱，但它配置较为复杂，且源码不好理解，最近又使劲看了下，结合自己的学习和理解，跟大家分享Heritrix的点点滴滴。 Heritrix的下载（http://sourceforge.net/projects/archive-crawler/）安装、配置，就不罗嗦了，可以自己找找资
  • 【Zookeeper】FAQ bit1129 zookeeper
    1.脱离IDE，运行简单的Java客户端程序 #ZkClient是简单的Zookeeper~$ java -cp "./:zookeeper-3.4.6.jar:./lib/*" ZKClient    1. Zookeeper是的Watcher回调是同步操作，需要添加异步处理的代码 2. 如果Zookeeper集群跨越多个机房，那么Leader/
  • The user specified as a definer ('aaa'@'localhost') does not exist 白糖_ localhost
    今天遇到一个客户BUG，当前的jdbc连接用户是root，然后部分删除操作都会报下面这个错误：The user specified as a definer ('aaa'@'localhost') does not exist 最后找原因发现删除操作做了触发器，而触发器里面有这样一句 /*!50017 DEFINER = ''aaa@'localhost' */  原来最初
  • javascript中showModelDialog刷新父页面 bozch JavaScript刷新父页面showModalDialog
    在页面中使用showModalDialog打开模式子页面窗口的时候，如果想在子页面中操作父页面中的某个节点，可以通过如下的进行：       window.showModalDialog('url',self,‘status...’); // 首先中间参数使用self       在子页面使用w
  • 编程之美-买书折扣 bylijinnan 编程之美
    import java.util.Arrays; public class BookDiscount { /**编程之美 买书折扣 书上的贪心算法的分析很有意思，我看了半天看不懂，结果作者说，贪心算法在这个问题上是不适用的。。 下面用动态规划实现。 哈利波特这本书一共有五卷，每卷都是8欧元，如果读者一次购买不同的两卷可扣除5%的折扣，三卷10%，四卷20%，五卷
  • 关于struts2.3.4项目跨站执行脚本以及远程执行漏洞修复概要 chenbowen00 strutsWEB安全
    因为近期负责的几个银行系统软件，需要交付客户，因此客户专门请了安全公司对系统进行了安全评测，结果发现了诸如跨站执行脚本，远程执行漏洞以及弱口令等问题。 下面记录下本次解决的过程以便后续 1、首先从最简单的开始处理，服务器的弱口令问题，首先根据安全工具提供的测试描述中发现应用服务器中存在一个匿名用户，默认是不需要密码的，经过分析发现服务器使用了FTP协议， 而使用ftp协议默认会产生一个匿名用
  • [电力与暖气]煤炭燃烧与电力加温 comsci
          在宇宙中,用贝塔射线观测地球某个部分,看上去,好像一个个马蜂窝,又像珊瑚礁一样,原来是某个国家的采煤区.....       不过,这个采煤区的煤炭看来是要用完了.....那么依赖将起燃烧并取暖的城市,在极度严寒的季节中...该怎么办呢?   &nbs
  • oracle O7_DICTIONARY_ACCESSIBILITY参数 daizj oracle
    O7_DICTIONARY_ACCESSIBILITY参数控制对数据字典的访问.设置为true,如果用户被授予了如select any table等any table权限,用户即使不是dba或sysdba用户也可以访问数据字典.在9i及以上版本默认为false,8i及以前版本默认为true.如果设置为true就可能会带来安全上的一些问题.这也就为什么O7_DICTIONARY_ACCESSIBIL
  • 比较全面的MySQL优化参考 dengkane mysql
    本文整理了一些MySQL的通用优化方法，做个简单的总结分享，旨在帮助那些没有专职MySQL DBA的企业做好基本的优化工作，至于具体的SQL优化，大部分通过加适当的索引即可达到效果，更复杂的就需要具体分析了，可以参考本站的一些优化案例或者联系我，下方有我的联系方式。这是上篇。   1、硬件层相关优化   1.1、CPU相关   在服务器的BIOS设置中，可
  • C语言homework2，有一个逆序打印数字的小算法 dcj3sjt126com c
    #h1#   0、完成课堂例子 1、将一个四位数逆序打印 1234 ==> 4321 实现方法一： # include <stdio.h> int main(void) { int i = 1234; int one = i%10; int two = i / 10 % 10; int three = i / 100 % 10;
  • apacheBench对网站进行压力测试 dcj3sjt126com apachebench
       ab 的全称是 ApacheBench ， 是 Apache 附带的一个小工具 ， 专门用于 HTTP Server 的 benchmark testing ， 可以同时模拟多个并发请求。前段时间看到公司的开发人员也在用它作一些测试，看起来也不错，很简单，也很容易使用，所以今天花一点时间看了一下。 通过下面的一个简单的例子和注释，相信大家可以更容易理解这个工具的使用。
  • 2种办法让HashMap线程安全 flyfoxs javajdkjni
    多线程之--2种办法让HashMap线程安全 多线程之--synchronized 和reentrantlock的优缺点 多线程之--2种JAVA乐观锁的比较( NonfairSync VS. FairSync)     HashMap不是线程安全的,往往在写程序时需要通过一些方法来回避.其实JDK原生的提供了2种方法让HashMap支持线程安全.  
  • Spring Security（04）——认证简介 234390216 Spring Security认证过程
    认证简介 目录 1.1     认证过程 1.2     Web应用的认证过程 1.2.1    ExceptionTranslationFilter 1.2.2    在request之间共享SecurityContext   1
  • Java 位运算 Javahuhui java位运算
    // 左移( << ) 低位补0 // 0000 0000 0000 0000 0000 0000 0000 0110 然后左移2位后，低位补0： // 0000 0000 0000 0000 0000 0000 0001 1000 System.out.println(6 << 2);// 运行结果是24 // 右移( >> ) 高位补"
  • mysql免安装版配置 ldzyz007 mysql
    1、my-small.ini是为了小型数据库而设计的。不应该把这个模型用于含有一些常用项目的数据库。 2、my-medium.ini是为中等规模的数据库而设计的。如果你正在企业中使用RHEL,可能会比这个操作系统的最小RAM需求(256MB)明显多得多的物理内存。由此可见，如果有那么多RAM内存可以使用，自然可以在同一台机器上运行其它服务。 3、my-large.ini是为专用于一个SQL数据
  • MFC和ado数据库使用时遇到的问题 你不认识的休道人 sqlC++mfc
    =================================================================== 第一个 =================================================================== try{ CString sql; sql.Format("select * from p
  • 表单重复提交Double Submits rensanning double
    可能发生的场景： *多次点击提交按钮 *刷新页面 *点击浏览器回退按钮 *直接访问收藏夹中的地址 *重复发送HTTP请求（Ajax） （1）点击按钮后disable该按钮一会儿，这样能避免急躁的用户频繁点击按钮。 这种方法确实有些粗暴，友好一点的可以把按钮的文字变一下做个提示，比如Bootstrap的做法： http://getbootstrap.co
  • Java String 十大常见问题 tomcat_oracle java正则表达式
    　1.字符串比较，使用“==”还是equals()? 　　"=="判断两个引用的是不是同一个内存地址(同一个物理对象)。 　　equals()判断两个字符串的值是否相等。 　　除非你想判断两个string引用是否同一个对象，否则应该总是使用equals()方法。 　　如果你了解字符串的驻留(String Interning)则会更好地理解这个问题。 　 　
  • SpringMVC 登陆拦截器实现登陆控制 xp9802 springMVC
    思路，先登陆后，将登陆信息存储在session中，然后通过拦截器，对系统中的页面和资源进行访问拦截，同时对于登陆本身相关的页面和资源不拦截。   实现方法： 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他