海洋_5ad4
海洋_5ad4

CSS和JS

使用CSS完成网站首页的优化

需求分析：

  • 由于我们昨天使用表格布局存在缺陷，那么我们要来考虑使用DIV+CSS来对页面进行优化
  • 表格布局的缺陷
    • 1.嵌套层级太多，一旦出现嵌套顺序错乱，整个页面达不到预期效果
    • 2.采用表格布局，页面不够灵活，动其中某一块，整个表格布局的结构全部要变

技术分析：

  • HTML的块标签
    • div标签：默认占一行，自动换行
    • span标签：内容显示在同一行
  • CSS概述
    • Cascading Style Sheets:层叠样式表
    • 主要作用 美化HTML页面
    • HTML决定网页的骨架
    • 将页面的HTML和美化进行分离
  • CSS的简单语法
    • 在一个style标签中，去编写CSS内容，最好将style标签写在这个head标签中
  • CSS选择器：帮助我们找到我们要修饰的标签


    
        
        
        
    
    
        
大家新年好，恭喜发财，红包拿来

        
大家新年好，恭喜发财，红包拿来

        
大家新年好，恭喜发财，红包拿来

        
大家新年好，恭喜发财，红包拿来

        
大家新年好，恭喜发财，红包拿来

  • 元素选择:

    元素的名称{
  属性名称:属性的值;
  属性名称:属性的值;
}

    

  
      
      
      
  
  
      讲完这个内容大家就可以下课了
      讲完这个内容大家就可以下课了
      讲完这个内容大家就可以下课了
      讲完这个内容大家就可以下课了

  • ID选择器：

    以#号开头  ID在整个页面中必须是唯一的
ID的名称{
  属性名称:属性的值;
  属性名称:属性的值;
}

    

  
      
      
      
  
  
      
    JAVAEE
    
      
    IOS
    
      
    ANDROID

  • 类选择器：

    以.开头
.类的名称{
  属性名称:属性的值;
  属性名称:属性的值;
}

    

  
      
      
      
  
  
      
    香蕉
    
      
    黄瓜
    
      
    苹果
    
      
    茄子
    
      
    橘子

  • CSS的引入方式：

    • 外部样式：通过link标签引入一个外部的css文件

      .shuiguo{
                color:yellow;
                
            }
            .shucai{
                color: green;
            }

      

    
        
        
        
    
    
        
      甘蔗
      
        
      黄瓜
      
        
      苹果
      
        
      茄子
      
        
      橘子

    • 内部样式：直接在style标签内编写css代码

    • 行内样式：直接在标签中添加一个style属性，编写CSS样式

      

    
        
        
        
    
    
        
      甘蔗
      
        
      黄瓜
      
        
      苹果
      
        
      茄子
      
        
      橘子

  • CSS浮动：

步骤分析：

  1. 创一个最外层div
  2. 第一部分：LOGO部分：嵌套三个div
  3. 第二部分：导航栏部分：放置5个超链接
  4. 第三部分：轮播图
  5. 第四部分：嵌套一个三行7列的表格
  6. 第五部分：直接放一张图片
  7. 第六部分：抄第四部分的
  8. 第七部分：放置一张图片
  9. 第八部分：放一堆超链接

代码实现：



    
        
        
         
        
    
    
        
        

            
            
            
                
            
            

            
            
            
            
            
                
             
            

                
            

             
            

                
最新商品

                
                
                

                    
                

                
                

                    

                        
                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    
                

            

            
            
            

                
            

            
            

                
最新商品

                
                
                

                    
                

                
                

                    

                        
                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    

                        
                        
高压锅

                        
$998

                    

                    
                

            

            
            
            

                
            

            
            
        

    


.logo{
                float: left;
                width: 33%;
                /*border-width: 1px;
                border-style: solid;
                border-color: red;*/
                height: 60px;
                line-height: 60px;
        /*      border: 1px solid red;*/
            }
            
            
            .amenu{
                color: white;
                text-decoration: none;
                height: 50px;
                line-height: 50px;
            }
            
            .product{
                float: left; text-align: center; width: 16%; height: 240px;
            }

扩展：

  • CSS的优先级

    • 按照选择器搜索精确度来编写： 行内样式>ID选择器>类选择器>元素选择器
    • 就近原则：哪个离得近，就选用哪个的样式

  • CSS中的其他选择器

    • 选择器分组：选择器1,选择器2{属性的名称：属性的值}

    • 属性选择器：

      a[title]
a[title='aaa']
a[href][title]
a[href][title='aaa']

    • 后代选择器：选择器1 选择器2 可以找出所有选择器2后代

      

    
        
        
        
    
    
        
      
            this is a
            儿子
            
                孙子

    • 子元素选择器：父选择器 > 儿子选择器 只能找出子选择器，不能找出所有后代

      

    
        
        
        
    
    
        
      
            this is a
            儿子
            
                孙子

    • 伪类选择器：通常都是用在A标签上

      

    
        
        
        
    
    
        黑马程序员

使用DIV+CSS完成注册页面的优化

需求分析

由于我们的注册页面也是用table布局的，存在与首页同样的问题，所以我们需要使用div+css对我们的注册页面进行美化总共是5部分内容

技术分析

  • CSS的盒子模型：万物皆盒子

  • 内边距：

    • padding-top；

    • padding-right；

    • padding-bottom；

    • padding-left；

      padding:10px;               上下左右都是10px
padding:10px 20px;          上下是10px 左右是20px
padding:10px 20px 30px;     上10px 右20px 下30px
padding:10px 20px 30px 40px;上10px 右20px 下30px 左40px，上右下左，顺时针方向

  • 外边距：

    • margin-top:
    • margin-right:
    • margin-bottom:
    • margin-left:

  • CSS绝对定位:

    • position:absolute
    • top:控制距离顶部的位置
    • left：控制距离左边的位置

代码实现



    
        
        
         
    
    
        
        

            
            
            
            
            
            

            
            
            
            

                
                

                    

                        

                            会员注册USER REGISTER
                            
                        

                        

                            用户名:
                            
                        

                        

                            密码:
                            
                        

                        

                            确认密码:
                            
                        

                        

                            email:
                            
                        

                        

                            姓名:
                            
                        

                        

                            性别:
                             男
                             女
                             妖
                            
                        

                        

                            出生日期:
                            
                        

                        

                            验证码:

CSS部分的回顾

  • CSS：层叠样式表

  • CSS作用：美化页面，提高代码的复用性

  • 选择器

    • 需要掌握的

      • 元素选择器：标签的名称
      • 类选择器：以.开头
      • ID选择器:以#开头，#ID的名称 ID必须是唯一的

    • 扩展选择器

      • 选择器分组：选择器1,选择器2 以逗号隔开

      • 后代选择器：选择器1 选择器2 中间以空格隔开

      • 子元素选择器： 爸爸>儿子

      • 属性选择器: 选择器[属性的名称='']

      • 伪类选择器：超链接标签上使用

  • 盒子模型：顺时针：上右下左

    • padding：内边距，控制的是盒子内容的距离
    • margin：外边距 控制盒子与盒子之间的距离

  • 绝对定位

    • position:absolute
    • top
    • left

使用JS完成简单的数据校验

需要分析

  • 使用JS完成对注册页面的简单数据校验，不允许出现用户名或密码为空的情况

技术分析

JavaScript概述

  • 什么是javascript:JavaScript一种直译式脚本语言，
  • 什么是脚本语言？
    • java源代码--->编译成.class文件--->java虚拟机中才能执行
    • 脚本语言：源码--->解释执行
    • js由我们的浏览器来解释执行
  • HTML：决定了页面的框架
  • CSS：用来美化我们的页面
  • JS：提供用户交互

JS的组成:

  • ECMAScript：核心部分，定义了js的语法规范
  • DOM：document Object Model文档对象模型，主要是用来管理页面的
  • BOM：Browser Object Model 浏览器对象模型，前进，后退，页面刷新，地址栏，历史记录，屏幕宽高

JS的语法:

  • 变量弱类型：var i = true
  • 区分大小写
  • 语句结束之后的分号，可以有，也可以没有
  • 写在script标签

JS的数据类型:

  • 基本类型
    • string
    • number
    • boolean
    • undefine
    • null
  • 引用类型
    • 对象，内置对象
  • 类型转换
    • js内部自动转换
      • string---->String

JS的运算符和语句：

  • 运算符和java一样
    • ”===“全等号：值和类型都必须相等
    • "==" 等等好：值相等就可以了
  • 语句和java一样

JS的输出：

  • alert()直接弹框

  • document.write() 向页面输出

  • console.log() 向控制台输出

  • innerHTML ：向页面输出

  • 获取页面元素：document.getElementByld("id的名称");

  • JS声明变量

    • var 变量的名称 = 变量的值

  • JS声明函数

    • var 函数的名称 = function() {

      }

    • function 函数的名称(){

      }

JS的开发步骤

1.确定事件
2.通常事情都会触发一个函数
3.函数里面通常都会去操作页面元素，做一些交互动作



    
        
        
        
        
    
    
        
        
        

            这里的内容一会要被替换掉

步骤分析

代码实现



    
        
        
        
        
        
    
    
        

            用户名:

            密码:

            邮箱:

会定义变量：var 变量的名称 = 变量的值

会定义函数：

? function 函数的名称(参数的名称) {

? }

你可能感兴趣的:(CSS和JS)

  • 《AI大模型趣味实战 》第8集：多端适配 个人新闻头条 基于大模型和RSS聚合打造个人新闻电台(Flask WEB版) 2 带娃的IT创业者 AI大模型趣味实战人工智能flask前端
    《AI大模型趣味实战》第8集：多端适配个人新闻头条基于大模型和RSS聚合打造个人新闻电台(FlaskWEB版)2摘要本文末尾介绍了如何实现新闻智能体的方法。在信息爆炸的时代，如何高效获取和筛选感兴趣的新闻内容成为一个现实问题。本文将带领读者通过Python和Flask框架，结合大模型的强大能力，构建一个个性化的新闻聚合平台，不仅能够自动收集整理各类RSS源的新闻，还能以语音播报的形式提供"新闻电台
  • X.509数字证书的签名和指纹 汽车通信技术 【付费专栏】车载以太网协议数字证书
    X.509是一种非常普遍的数字证书标准，由国际电信联盟（ITU）制定。它定义了证书的格式和一种验证证书有效性的方法。X.509证书的结构遵循特定的语法和编码规则，通常使用ASN.1(AbstractSyntaxNotationOne)进行描述和编码。一个典型的X.509证书通常包含：版本、序列号、签名算法、颁发者、有效期、使用者、公钥、签名、指纹等。其中，版本号表示证书是哪个版本的，不同版本的数字
  • 从头开始学C语言第三十一天——void指针和const指针 神阶平天牛魔王 c语言
    void指针void指针是一种不确定数据类型的指针，可以通过强制转换类型让该指针指向任何数据类型的变量。说明形式：void*对于void指针，在没有强制转换数据类型之前，不能进行指针的算术运算#includeintmain(){inta=10;void*p;p=&a;printf("%d%d\n",a,*(int*)p);return0;}printf("%d%d\n",a,*(int*)p);这
  • 基于 MySQL 和 Spring Boot 的在线论坛管理系统设计与实现 城南|阿洋-计算机从小白到大神 mysqlspringboot数据库
    markdownCopy✌全网粉丝20W+,csdn特邀作者、博客专家、CSDN[新星计划]导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java、pyhton、机器学习技术领域和毕业项目实战✌哈喽兄弟们，好久不见哦～最近整理了一下之前写过的一些小项目/毕业设计。发现还是有很多存货的，想一想既然放在电脑里面也吃灰，那么还不如分享出去，没准还可以帮助到
  • LTE与5G NR频段组合：理解流数和双连接模式 空间机器人 5G等射频知识专栏5G
    LTE与5GNR频段组合：理解流数和双连接模式在现代移动通信技术中，LTE（4G）和5GNR（NewRadio）的频段组合是提高网络吞吐量、降低延迟和提升用户体验的关键之一。为了最大化数据传输速率，运营商往往采用载波聚合（CarrierAggregation,CA）和双连接（DualConnectivity,ENDC）技术来将多个频段组合在一起。本文将详细讲解LTE和5GNR各种频段组合的流数支持
  • 策略模式 烟沙九洲 设计模式策略模式java
    策略（Strategy）模式属于行为型模式的一种。策略模式的核心思想是定义一系列算法，将每个算法封装起来，并使它们可以互换。策略模式让算法独立于使用它的客户而变化，从而实现了算法族的独立扩展和替换。策略模式指在一个方法中，某些关键步骤的算法依赖调用方传入的策略，传入不同的策略，即可获得不同的结果，大大增强了系统的灵活性。策略模式的核心思想是在一个计算方法中把容易变化的算法抽出来作为“策略”参数传进
  • 转 C# .NET4.0 混合模式程序集异常 weixin_30516243
    1.引用Microsoft.DirectX.dll和Microsoft.DirectX.Directsound.dll这2个文件。2.项目属性里边，把目标平台改成X86。3.App.Config修改下：123456在.NET4.0下使用Dirext3D托管库，出现“混合模式程序集是针对“v1.1.4322”版的运行时生成的，在没有配置其他信息的情况下，无法在4.0运行时中加载该程序集。”异常信息，
  • .net 4.0环境异步方法实现，异步委托和回调异常处理 蔚蓝星空-大强 异步多线程c#asp.net
    .net4.0环境异步方法实现，异步委托和回调异常处理无返回值的异步方法通过委托实现staticvoidMain(string[]args){//异步执行写入数据任务，不阻塞主线程任务SetDataAsync(1);Console.WriteLine("主线程后续任务...");Console.ReadKey();}publicstaticvoidSetDataAsync(intnum){//这里
  • .net 4.0 webServices 的使用，从前端到后端，代码超全。 静静香甜 .net前端后端c#
    1、创建webServices：创建之后会生成两个文件，分别是：SecurityWebService.asmx，SecurityWebService.asmx.csSecurityWebService.asmx代码：SecurityWebService.asmx.cs代码：usingNewtonsoft.Json;usingNewtonsoft.Json.Linq;usingSystem;usin
  • SSLTLS加密传输与数字证书的前世今生 云来雁去 .NET源代码探案系列数字证书HTTPS加密SSL
    Hi，大家好，我是飞鸿踏雪，欢迎大家关注我的博客。近来，博主经历了一次服务器迁移，本以为有Docker-Compose加持，一切应该会非常顺利，没想到最终还是在证书上栽了跟头，因为它的证书是和IP地址绑定的。对，你没听错，这个世界上还真就有这么别扭的设定，尤其是你折腾了一整天，发现你需要到一个CA服务器上去申请证书的时候，那种绝望你晓得吧？数字证书、HTTPS、SSL/TLS、加密……无数的词汇在
  • 【分治法】最接近点对问题 C++（附代码分析及实例） haaaaaaarry 算法设计与分析算法
    问题描述给定平面上n个点，找其中的一对点，使得在n个点组成的所有点对中，该点对间的距离最小问题分析先考虑一下一维情况下，取中间某个点m，将所有点划分为两个集合，递归的找出左右集合的最接近点对，最后再和最靠近点m的左右两点间的距离作比较，最小的就是整个点对中最接近的现在将一维的情况扩展到二维，二维比一维复杂的地方在于每个点都有两个坐标，我们用一条直线l将平面上的所有点同样分成两个集合，再递归的去两个
  • [开题报告]Springboot高校图书管理系统设计与实现lq627计算机毕业设计 卓越计算机毕设 课程设计
    本项目包含程序+源码+数据库+LW+调试部署环境，文末可获取一份本项目的java源码和数据库参考。开题报告研究背景：随着高校图书馆的规模不断扩大和信息化程度的提高，传统的手工管理方式已经无法满足日益增长的图书馆资源管理需求。图书管理系统的设计与实现成为了解决这一问题的关键。通过引入计算机技术和信息管理系统，可以提高图书馆的管理效率和服务质量，为读者提供更便捷、高效的借阅体验。研究意义：图书管理系统
  • 【重温设计模式】访问者模式及其Java示例 万猫学社 重温设计模式及其Java实现设计模式访问者模式java
    访问者模式的基本概念访问者模式，一种行为型设计模式，其基本定义是：允许一个或者多个操作应用到一组对象上，解耦操作和对象的具体类，使得操作的添加可以独立于对象的类结构变化。在面向对象编程中，访问者模式的重要性不言而喻。它将数据操作和数据结构分离，使得在不改变数据结构的前提下，可以添加新的操作，从而增强了系统的灵活性和可扩展性。在访问者模式中，数据结构是稳定的，而操作是易变的。这就像一座博物馆，展品（
  • 鸿蒙5开发：Ark-TS UI 动效设计指南：让你的应用界面 “活” 起来 harmonyos-next
    在鸿蒙5应用开发中，Ark-TSUI不仅能让你快速构建漂亮的界面，还提供了丰富的动效功能，让界面交互更加流畅和有趣。今天咱们聊聊Ark-TSUI的动效设计，看看如何用几行代码实现按钮点击动画、页面过渡效果等，让你的应用“眼前一亮”。一、Ark-TSUI动效的核心玩法：简单又强大Ark-TSUI的动效设计基于Animator类和内置的过渡效果，无需复杂的第三方库，就能实现多种动画效果。比如：按钮点击
  • 数字签名与数字证书 TABE_ 计算机网络数字签名数字证书
    这里写目录标题数字签名数字证书数字证书的原理数字证书的特点如何验证证书机构的公钥不是伪造的数字签名数字签名是非对称密钥加密技术与数字摘要技术的应用，数字签名就是用加密算法加密报文文本的摘要（摘要通过hash函数得到）而生成的内容。发送报文时，发送方用一个哈希函数从报文文本中生成报文摘要，然后用发送方的私钥对这个摘要进行加密生成数字签名，之后将数字签名和报文一起发送给接收方，即数字证书。接收方首先用
  • Python 中的 Iterable、Iterator 与生成器 CavenWang pythonpython开发语言
    Python中的Iterable、Iterator与生成器Iterable（可迭代对象）Iterator（迭代器）生成器（Generator）Iterable、Iterator与生成器的关系实际应用生成器的高级用法（send()）总结在Python中，Iterable、Iterator和生成器是三个密切相关的概念，它们都与迭代操作有关，但各自扮演不同的角色。本文将深入探讨它们的定义、区别以及实际应
  • 如何设计一个 RPC 框架？需要考虑哪些点？ 蒂法就是我 rpc网络协议网络
    设计一个完整的RPC框架需要覆盖以下核心模块及关键技术点：一、核心架构模块模块功能与实现要点服务注册与发现使用Zookeeper/Nacos等实现服务地址动态注册与订阅，支持心跳检测和节点变更通知网络通信层基于Netty或gRPC的HTTP/2实现异步非阻塞传输，优化连接池复用与零拷贝技术序列化协议支持Protobuf（高性能）、JSON（可读性）、Hessian（跨语言）等，需平衡性能与扩展性动
  • 零基础入门机器学习：用Scikit-learn实现鸢尾花分类 藍海琴泉 机器学习scikit-learn分类
    适合人群：机器学习新手|数据分析爱好者|需快速展示案例的学生一、引言：为什么要学这个案例？目的：明确机器学习解决什么问题，建立学习信心。机器学习定义：让计算机从数据中自动学习规律（如分类鸢尾花品种）。为什么选鸢尾花数据集：数据量小、特征明确，适合教学演示。Scikit-learn优势：提供现成算法和工具，无需从头写数学公式。二、环境准备：5分钟快速上手目的：搭建可运行的代码环境，避免卡在工具安装环
  • 数字证书 与 数字签名 介绍 张紫娃 网络编程网络安全服务器
    目录数字签名什么时候公钥加密数据，什么时候私钥加密数据？消息认证码（MAC）和数字签名区别数字证书如何使用数字证书验证服务器身份？数字签名定义：它类似于现实生活中的手写签名。手写签名的法律效力1、每个人的笔迹因生理和心理差异而独一无二，难以复制。签名被视为真实性和有效性的直接证明。2、手写签名是法律文件生效的核心要件之一，能证明签署人对文件内容的认可与授权。具有不可否认性。数字签名的过程(1)签名
  • 访问者模式 烟沙九洲 设计模式访问者模式java
    访问者（Visitor）模式属于行为型模式的一种。访问者模式主要用于分离算法和对象结构，从而在不修改原有对象的情况下扩展新的操作。它适用于数据结构相对稳定，而操作（行为）容易变化的场景。访问者模式允许在不修改现有类的情况下，为类层次结构中的对象定义新的操作。访问者模式通过将操作封装到一个独立的类（即访问者）中，使得对象结构与操作解耦。访问者模式使用了一种名为双分派（在运行时根据两个对象的类型动态选
  • 小白学AI量化：DeepSeek+Python构建强大的金融数据挖掘与多维分析机器人 老余捞鱼 AI顾投高级策略AI探讨与学习人工智能python金融deepseek
    作者：老余捞鱼原创不易，转载请标明出处及原作者。写在前面的话：在机构主导的量化交易时代，普通投资者如何用一杯奶茶的钱（15元/天）打造专业级智能量化产品？本文将为您揭秘一个革命性的解决方案——基于国产大模型DeepSeek和Python构建的智能数据挖掘分析机器人。它不仅适用于通用网页数据抓取，更能深度应用于金融领域，精准捕捉市场信号。本文“干货”很多，请务必耐心读完。一、颠覆认知的性价比革命1.
  • 软考 中级软件设计师 考点知识点笔记总结 day06 莫问alicia 软考中级软件设计师笔记数据结构算法
    文章目录6、树和二叉树6.1、树的基本概念6.2、二叉树的基本概念6.3、二叉树的遍历6.4、查找二叉树（二叉排序树）BST6.5、构造霍夫曼树+6.6、线索二叉树6.7、平衡二叉树7、图7.1、存储结构-邻接矩阵7.2、存储结构-邻接表7.3、图的遍历7.4、拓扑排序7.5、最小生成树普利姆算法7.6、克鲁斯卡尔算法6、树和二叉树6.1、树的基本概念结点的度：一个结点的度是指该结点拥有的子树数量
  • 内核调试环境：buildroot/debootstrap制作文件系统、编译内核、QEMU模拟 苏打呀 linuxqemukernel
    编译内核#安装常用工具和依赖，可能会多，懒得分了，全装了吧反正以后说不定还要用。。。sudoaptinstallcurlwgetgpgzshtreegitnet-toolsproxychains4remminavimtarstracellvmclangunzipgccgcc-multilibbuild-essentialflexbisoncmakemakegawkdkmsautoconfninja
  • Bash 脚本基础 HXQ_晴天 linuxbashchrome开发语言
    一、Bash脚本基础什么是Bash脚本：Bash脚本是一种文本文件，其中包含了一系列的命令，这些命令可以被Bashshell执行。它用于自动化重复性的任务，提高工作效率。Bash脚本的基本结构：以#!/bin/bash开头，表示使用Bash解释器来执行脚本。接下来是具体的命令和操作。二、编写和运行第一个Bash脚本创建脚本文件：使用命令nanohello.sh创建名为hello.sh的文件。编写脚
  • 【机器学习】机器学习工程实战-第3章 数据收集和准备 腊肉芥末果 机器学习工程实战机器学习人工智能
    上一章：第2章项目开始前文章目录3.1关于数据的问题3.1.1数据是否可获得3.1.2数据是否相当大3.1.3数据是否可用3.1.4数据是否可理解3.1.5数据是否可靠3.2数据的常见问题3.2.1高成本3.2.2质量差3.2.3噪声（noise）3.2.4偏差（bias）3.2.5预测能力低（lowpredictivepower）3.2.6过时的样本3.2.7离群值3.2.8数据泄露/目标泄漏3
  • HTML+CSS案例展示(CSS3D效果旋转相册) hacalili htmlcss前端css3
    参考来源：黑马程序员pink老师前端入门教程，零基础必看的h5(html5)+css3+移动端前端视频教程_哔哩哔哩_bilibili效果展示：总结：transform：translate(x,y)rotate(180deg)scale()...顺序对最后的效果有影响，需要根据需求安排位移和其他属性的顺序；实现暂停动画效果：animation-play-state:paused;经常和鼠标经过等其
  • python processpoolexecutor_Python多进程解决方案multiprocessing ProcessPoolExecutor weixin_39599046 python
    大多数编程语言都会有多线程和多进程的概念，至于线程和进程的概念，大家可以百度一下。作为一门胶水语言，Python毫不意外，也可以利用多线程和多进程处理并发问题，但是多线程由于GIL的存在，起作用范围大打折扣，仅限于在IO等场景可以发挥点作用。所以，今天要跟大家分享的是Python多进程方案，更好地利用系统多核，从而提升性能。基础方案一：利用Process新建一个子进程，在子进程执行任务。我们写一个
  • python processpoolexecutor_Python线程和进程池并行编程 三千香蕉三千 python
    Python3.2版本之后发布了concurrent.futures模块，用以支持和管理并发编程，内容涵盖了进程和线程池(ThreadandProcessPooling)、非确定性执行流(NondeterministicExecutionFlows)以及进程和线程同步。本文通过将带有可选参数的任务提交(Submit)给执行器(Executor)来实例化futures对象。执行器是线程或者进程执行池
  • html5 相册翻转效果,HTML5 css3：3D旋转木马效果相册 岑依惜 html5相册翻转效果
    这篇博客的目的是因为上篇HTML5CSS3专题诱人的实例CSS3打造百度贴吧的3D翻牌效果中有个关于CSS3D效果的比较重要的知识点没讲到，就是perspective和tranlateY效果图：嘿嘿，我把大学毕业时的一些照片，做成旋转木马，绕着我大文理旋转，不忘母校的培育之恩~1、perspectiveperspective属性包括两个属性：none和具有单位的长度值。其中perspective属
  • python 底层原理processpoolexecutor_Python 并发编程：PoolExecutor 篇 风投小虾 python
    个人笔记，如有疏漏，还请指正。使用多线程(threading)和多进程(multiprocessing)完成常规的并发需求，在启动的时候start、join等步骤不能省，复杂的需要还要用1-2个队列。随着需求越来越复杂，如果没有良好的设计和抽象这部分的功能层次，代码量越多调试的难度就越大。对于需要并发执行、但是对实时性要求不高的任务，我们可以使用concurrent.futures包中的PoolE
  • 统一思想认识 永夜-极光 思想
    1.统一思想认识的基础,才能有的放矢  原因:    总有一种描述事物的方式最贴近本质,最容易让人理解.    如何让教育更轻松,在于找到最适合学生的方式.          难点在于,如何模拟对方的思维基础选择合适的方式.   &
  • Joda Time使用笔记 bylijinnan javajoda time
    Joda Time的介绍可以参考这篇文章： http://www.ibm.com/developerworks/cn/java/j-jodatime.html 工作中也常常用到Joda Time，为了避免每次使用都查API，记录一下常用的用法：     /** * DateTime变化（增减） */ @Tes
  • FileUtils API eksliang FileUtilsFileUtils API
    转载请出自出处：http://eksliang.iteye.com/blog/2217374 一、概述 这是一个Java操作文件的常用库，是Apache对java的IO包的封装，这里面有两个非常核心的类FilenameUtils跟FileUtils，其中FilenameUtils是对文件名操作的封装;FileUtils是文件封装，开发中对文件的操作，几乎都可以在这个框架里面找到。 非常的好用。
  • 各种新兴技术 不懂事的小屁孩 技术
    1:gradle Gradle 是以 Groovy 语言为基础，面向Java应用为主。基于DSL（领域特定语言）语法的自动化构建工具。 现在构建系统常用到maven工具，现在有更容易上手的gradle， 搭建java环境: http://www.ibm.com/developerworks/cn/opensource/os-cn-gradle/ 搭建android环境： http://m
  • tomcat6的https双向认证 酷的飞上天空 tomcat6
    1.生成服务器端证书 keytool -genkey -keyalg RSA -dname "cn=localhost,ou=sango,o=none,l=china,st=beijing,c=cn" -alias server -keypass password -keystore server.jks -storepass password -validity 36
  • 托管虚拟桌面市场势不可挡 蓝儿唯美
    用户还需要冗余的数据中心，dinCloud的高级副总裁兼首席营销官Ali Din指出。该公司转售一个MSP可以让用户登录并管理和提供服务的用于DaaS的云自动化控制台，提供服务或者MSP也可以自己来控制。 在某些情况下，MSP会在dinCloud的云服务上进行服务分层，如监控和补丁管理。 MSP的利润空间将根据其参与的程度而有所不同，Din说。 “我们有一些合作伙伴负责将我们推荐给客户作为个
  • spring学习——xml文件的配置 a-john spring
    在Spring的学习中，对于其xml文件的配置是必不可少的。在Spring的多种装配Bean的方式中，采用XML配置也是最常见的。以下是一个简单的XML配置文件： <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.or
  • HDU 4342 History repeat itself 模拟 aijuans 模拟
    来源：http://acm.hdu.edu.cn/showproblem.php?pid=4342 题意：首先让求第几个非平方数，然后求从1到该数之间的每个sqrt(i)的下取整的和。 思路：一个简单的模拟题目，但是由于数据范围大，需要用__int64。我们可以首先把平方数筛选出来，假如让求第n个非平方数的话，看n前面有多少个平方数，假设有x个，则第n个非平方数就是n+x。注意两种特殊情况，即
  • java中最常用jar包的用途 asia007 java
    java中最常用jar包的用途 jar包用途axis.jarSOAP引擎包commons-discovery-0.2.jar用来发现、查找和实现可插入式接口，提供一些一般类实例化、单件的生命周期管理的常用方法.jaxrpc.jarAxis运行所需要的组件包saaj.jar创建到端点的点到点连接的方法、创建并处理SOAP消息和附件的方法，以及接收和处理SOAP错误的方法.  w
  • ajax获取Struts框架中的json编码异常和Struts中的主控制器异常的解决办法 百合不是茶 jsjson编码返回异常
    一:ajax获取自定义Struts框架中的json编码  出现以下 问题:       1,强制flush输出  json编码打印在首页 2, 不强制flush js会解析json 打印出来的是错误的jsp页面   却没有跳转到错误页面 3,  ajax中的dataType的json 改为text 会
  • JUnit使用的设计模式 bijian1013 java设计模式JUnit
    JUnit源代码涉及使用了大量设计模式 1、模板方法模式（Template Method）         定义一个操作中的算法骨架，而将一些步骤延伸到子类中去，使得子类可以不改变一个算法的结构，即可重新定义该算法的某些特定步骤。这里需要复用的是算法的结构，也就是步骤，而步骤的实现可以在子类中完成。   
  • Linux常用命令（摘录） sunjing crondchkconfig
    chkconfig --list   查看linux所有服务 chkconfig --add servicename 添加linux服务 netstat -apn | grep 8080  查看端口占用 env 查看所有环境变量 echo $JAVA_HOME 查看JAVA_HOME环境变量   安装编译器 yum install -y gcc
  • 【Hadoop一】Hadoop伪集群环境搭建 bit1129 hadoop
     结合网上多份文档，不断反复的修正hadoop启动和运行过程中出现的问题，终于把Hadoop2.5.2伪分布式安装起来，跑通了wordcount例子。Hadoop的安装复杂性的体现之一是，Hadoop的安装文档非常多，但是能一个文档走下来的少之又少，尤其是Hadoop不同版本的配置差异非常的大。Hadoop2.5.2于前两天发布，但是它的配置跟2.5.0，2.5.1没有分别。 &nb
  • Anychart图表系列五之事件监听 白糖_ chart
    创建图表事件监听非常简单：首先是通过addEventListener('监听类型',js监听方法)添加事件监听，然后在js监听方法中定义具体监听逻辑。 以钻取操作为例，当用户点击图表某一个point的时候弹出point的name和value，代码如下： <script> //创建AnyChart var chart = new AnyChart(); //添加钻取操作&quo
  • Web前端相关段子 braveCS web前端
    Web标准：结构、样式和行为分离   使用语义化标签 0）标签的语义：使用有良好语义的标签，能够很好地实现自我解释，方便搜索引擎理解网页结构，抓取重要内容。去样式后也会根据浏览器的默认样式很好的组织网页内容，具有很好的可读性，从而实现对特殊终端的兼容。 1）div和span是没有语义的：只是分别用作块级元素和行内元素的区域分隔符。当页面内标签无法满足设计需求时，才会适当添加div
  • 编程之美-24点游戏 bylijinnan 编程之美
    import java.util.ArrayList; import java.util.Arrays; import java.util.HashSet; import java.util.List; import java.util.Random; import java.util.Set; public class PointGame { /**编程之美
  • 主页面子页面传值总结 chengxuyuancsdn 总结
    1、showModalDialog returnValue是javascript中html的window对象的属性,目的是返回窗口值,当用window.showModalDialog函数打开一个IE的模式窗口时,用于返回窗口的值 主界面 var sonValue=window.showModalDialog("son.jsp"); 子界面 window.retu
  • [网络与经济]互联网+的含义 comsci 互联网+
          互联网+后面是一个人的名字 = 网络控制系统       互联网+你的名字 =  网络个人数据库       每日提示:如果人觉得不舒服,千万不要外出到处走动,就呆在床上,玩玩手游,更不能够去开车,现在交通状况不
  • oracle 创建视图 with check option daizj 视图vieworalce
    我们来看下面的例子： create or replace view testview as select empno,ename from emp where ename like ‘M%’ with check option; 这里我们创建了一个视图，并使用了with check option来限制了视图。 然后我们来看一下视图包含的结果： select * from testv
  • ToastPlugin插件在cordova3.3下使用 dibov Cordova
        自己开发的Todos应用，想实现“ 再按一次返回键退出程序 ”的功能，采用网上的ToastPlugins插件，发现代码或文章基本都是老版本，运行问题比较多。折腾了好久才弄好。下面吧基于cordova3.3下的ToastPlugins相关代码共享。       ToastPlugin.java package&nbs
  • C语言22个系统函数 dcj3sjt126com cfunction
    C语言系统函数一、数学函数下列函数存放在math.h头文件中Double floor(double num) 求出不大于num的最大数。Double fmod(x, y) 求整数x/y的余数。Double frexp(num, exp); double num; int *exp; 将num分为数字部分（尾数）x和 以2位的指数部分n，即num=x*2n，指数n存放在exp指向的变量中，返回x。D
  • 开发一个类的流程 dcj3sjt126com 开发
    本人近日根据自己的开发经验总结了一个类的开发流程。这个流程适用于单独开发的构件，并不适用于对一个项目中的系统对象开发。开发出的类可以存入私人类库，供以后复用。   以下是开发流程： 1. 明确类的功能，抽象出类的大概结构 2. 初步设想类的接口 3. 类名设计（驼峰式命名） 4. 属性设置(权限设置) 判断某些变量是否有必要作为成员属
  • java 并发 shuizhaosi888 java 并发
    能够写出高伸缩性的并发是一门艺术   在JAVA SE5中新增了3个包 java.util.concurrent java.util.concurrent.atomic java.util.concurrent.locks 在java的内存模型中，类的实例字段、静态字段和构成数组的对象元素都会被多个线程所共享，局部变量与方法参数都是线程私有的，不会被共享。
  • Spring Security（11）——匿名认证 234390216 Spring SecurityROLE_ANNOYMOUS匿名
    匿名认证 目录 1.1     配置 1.2     AuthenticationTrustResolver          对于匿名访问的用户，Spring Security支持为其建立一个匿名的AnonymousAuthenticat
  • NODEJS项目实践0.2[ express,ajax通信...] 逐行分析JS源代码 Ajaxnodejsexpress
      一、前言         通过上节学习，我们已经        ubuntu系统搭建了一个可以访问的nodejs系统，并做了nginx转发。本节原要做web端服务 及 mongodb的存取，但写着写着，web端就
  • 在Struts2 的Action中怎样获取表单提交上来的多个checkbox的值 lhbthanks javahtmlstrutscheckbox
    第一种方法：获取结果String类型 在 Action 中获得的是一个 String 型数据，每一个被选中的 checkbox 的 value 被拼接在一起，每个值之间以逗号隔开(,)。 所以在 Action 中定义一个跟 checkbox 的 name 同名的属性来接收这些被选中的 checkbox 的 value 即可。 以下是实现的代码： 前台 HTML 代码：
  • 003.Kafka基本概念 nweiren hadoopkafka
    Kafka基本概念：Topic、Partition、Message、Producer、Broker、Consumer。 Topic：             消息源（Message）的分类。 Partition：             Topic物理上的分组，一
  • Linux环境下安装JDK roadrunners jdklinux
    1、准备工作 创建JDK的安装目录： mkdir -p /usr/java/   下载JDK，找到适合自己系统的JDK版本进行下载： http://www.oracle.com/technetwork/java/javase/downloads/index.html   把JDK安装包下载到/usr/java/目录，然后进行解压： tar -zxvf jre-7
  • Linux忘记root密码的解决思路 tomcat_oracle linux
    1：使用同版本的linux启动系统，chroot到忘记密码的根分区passwd改密码 　　2：grub启动菜单中加入init=/bin/bash进入系统，不过这时挂载的是只读分区。根据系统的分区情况进一步判断. 　　3: grub启动菜单中加入 single以单用户进入系统. 　　4:用以上方法mount到根分区把/etc/passwd中的root密码去除 　　例如: 　　ro
  • 跨浏览器 HTML5 postMessage 方法以及 message 事件模拟实现 xueyou jsonpjquery框架UIhtml5
    postMessage 是 HTML5 新方法，它可以实现跨域窗口之间通讯。到目前为止，只有 IE8+, Firefox 3, Opera 9, Chrome 3和 Safari 4 支持，而本篇文章主要讲述 postMessage 方法与 message 事件跨浏览器实现。postMessage 方法 JSONP 技术不一样，前者是前端擅长跨域文档数据即时通讯，后者擅长针对跨域服务端数据通讯，p
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他