hello world 999
hello world 999

Bootstrap框架

Bootstrap框架

目录

  • Bootstrap框架
        • 1.响应式开发
          • （1）响应式开发原理
          • （2）响应式布局容器
        • 2.Bootstrap文件框架
        • 3.Bootstarp布局容器：
          • （1）container类：
          • （2）container-fluid类：
        • 4.Bootstrap栅格系统
          • （1）栅格系统使用：
          • （2）栅格系统列嵌套：
          • （3）栅格系统列偏移：
          • （4）栅格系统列排序：
          • （5）栅格系统响应式工具：

1.响应式开发

（1）响应式开发原理

响应式开发就是通过媒体查询针对不同宽度的设备进行布局和样式的设置，从而适配不同设备的目的。

设备划分 尺寸区间
超小屏幕（手机） <= 768xp
小屏设备（平板） 768px ~ 992px
中等屏幕（左面显示器） 992px ~ 1200px
宽屏设备（大桌面显示器） >= 1200px
（2）响应式布局容器

响应式需要一个父级容器作为布局容器，来配合子集元素来实现变化效果。

在不同屏幕下，通过媒体查询来改变这个布局容器的大小，最后改变其中的子元素的排列方式和大小，实现不同的页面布局和样式变化。

响应式尺寸划分：

屏幕类型 设置宽度
超小屏幕（手机，小于768px） 设置宽度为100%
小屏幕（平板，大于等于768px） 设置宽度为750px
中等屏幕（桌面显示器，大于等于992px） 宽度设置为970px
大屏幕（大桌面显示器，大于等于1200px） 宽度设置为1170px

2.Bootstrap文件框架

Bootstarp来自Twitter是目前最受欢迎的前端框架，基于html、css和javaScript其更为灵活，使得Web开发更加快捷。

Bootstrap使用手册：https://getbootstrap.com/

步骤
step1：创建文件夹结构
step2：创建html骨架结构
step3：引入相关样式文件
step4：书写页面内容

Bootstrap框架_第1张图片

3.Bootstarp布局容器：

注意：Bootstrp需要为页面内容和栅格系统包裹一个.containner容器，Bootstrap预先定义好了这个类。

（1）container类：
  1. 响应式布局的容器（固定宽度）
  2. 大屏（>=1200px）宽度定为1170px
  3. 中屏（>=992px）宽度定为970px
  4. 小屏（>=768px）宽度定为750px
  5. 超小屏幕（100%）
（2）container-fluid类：
  • 流式布局容器（百分百宽度）
  • 占据全部视口（viewport）的容器
  • 适合于单独做移动端开发

4.Bootstrap栅格系统

gridsystems网格系统，是指将页面布局划分为等宽的列，然后通过列数的定义来模块化页面布局。

（1）栅格系统使用：

网格系统是通过一系列的行（row）与列（column）的组合来创建页面布局的，页面内容将被放在这些创建好的布局中。

超小屏幕（手机<768px） 小屏设备（平板>=768px） 中等屏幕（>=992px） 宽屏设备（>=1200px）
.conntainer最大宽度 自动100% 750px 970px 1170px
类前缀 .col-xs- .col-sm- .col-md- .col-lg-
列（column）总数 12 12 12 12

注意：

  1. 行（row）必须放到container布局容器里面
  2. 要实现列的平均划分需要给列添加类前缀。
  3. 每一列默认有左右15像素的padding值
  4. 可以同时为一列指定多个设备类名，以便划分不同的份数。
doctype html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    
	
	<link rel="stylesheet" href="bootstrap-3.4.1-dist/css/bootstrap.min.css"/>
	<title>Bootstraptitle>
	<style type="text/css">
		* {
			margin: 0;
			padding: 0;
		}
		[class^="col"] {
			border: 1px solid #ccc;
		}
		.container .row:nth-child(1) {
			background-color: pink; col-sm-6
		}
	style>
  head>
  <body>
	  <div class="container">
		  <div class="row">
			  <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">1div>
			  <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">2div>
			  <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">3div>
			  <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">4div>
		  div>
		  
		  <div class="row">
			  <div class="col-lg-6">1div>
			  <div class="col-lg-2">2div>
			  <div class="col-lg-2">3div>
			  <div class="col-lg-2">4div>
		  div>
		  
		  
	  div>
  body>
html>
（2）栅格系统列嵌套：
doctype html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		
		
		<link rel="stylesheet" href="bootstrap-3.4.1-dist/css/bootstrap.min.css" />
		<title>列嵌套title>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}

			[class^="col"] {
				border: 1px solid #ccc;
			}

			.row>div {
				height: 50px;
				background-color: pink;
			}
		style>
	head>
	<body>
		<div class="container">
			<div class="row">
				<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
					
					<div class="row">
						<div class="col-md-6">adiv>
						<div class="col-md-6">bdiv>
					div>
				div>
				<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">2div>
				<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">3div>
				<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">4div>
			div>
		div>
	body>
html>

Bootstrap框架_第2张图片

（3）栅格系统列偏移：

使用.col-md-offset-*类可以将列向右侧偏移，这些类实际是通过使用*选择器为当前元素增加了左侧的边距（margin）。

Bootstrap框架_第3张图片

doctype html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		
		
		<link rel="stylesheet" href="bootstrap-3.4.1-dist/css/bootstrap.min.css" />
		<title>列嵌套title>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}

			[class^="col"] {
				border: 1px solid #ccc;
			}

			.row div {
				height: 50px;
				background-color: pink;
			}
		style>
	head>
	<body>
		<div class="container">
			<div class="row">
				<div class="col-md-3">左侧div>
				<div class="col-md-3 col-md-offset-6">右侧div>
			div>
			<div class="row">
				<div class="col-md-8 col-md-offset-2">中间盒子div>
			div>
		div>
	body>
html>

Bootstrap框架_第4张图片

注意：本质上为盒子做的偏移是在盒子的左侧添加上一个margin值。

（4）栅格系统列排序：

通过使用.col-md-push-*和.col-md-pull-*类就可以很容易的改变列（column）的顺序。

Bootstrap框架_第5张图片

doctype html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		
		
		<link rel="stylesheet" href="bootstrap-3.4.1-dist/css/bootstrap.min.css" />
		<title>列排序title>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}

			[class^="col"] {
				border: 1px solid #ccc;
			}

			.row div {
				height: 50px;
				background-color: pink;
			}
		style>
	head>
	<body>
		<div class="container">
			<div class="row">
				<div class="col-md-4">左侧div>
				<div class="col-md-8">右侧div>
			div>
			<div class="row">
				<div class="col-md-4 col-md-push-8">左侧div>
				<div class="col-md-8 col-md-pull-4">右侧div>
			div>
		div>
	body>
html>

Bootstrap框架_第6张图片

（5）栅格系统响应式工具：

为了加快对移动设备友好的页面开发工作，利用媒体查询功能，并使用这些工具类可以方便的针对不同设备展示 or 隐藏页面内容。

类名 超小屏 小屏 中屏 大屏
.hidden-xs 隐藏 可见 可见 可见
.hidden-sm 可见 隐藏 可见 可见
.hidden-md 可见 可见 隐藏 可见
.hidden-ld 可见 可见 可见 隐藏

与之相反的是visible-xs、visible-sm、visible-md、visible-lg

注意：具体的Bootstrap其他（按钮、表单、表格）请参考bootstrap文档。

你可能感兴趣的:(#,Linux鸟哥的私房菜,bootstrap,css,javascript)

  • Linux dirname、basename 指令 weixin_30457465 操作系统
    Linuxdirname、basename指令(2012-04-3021:44:53)转载▼标签：杂谈分类：linux一、dirname指令1、功能：从给定的包含绝对路径的文件名中去除文件名（非目录的部分），然后返回剩下的路径（目录的部分）2、用法：dirnamefilename例如下面几个例子（1）#dirname/etc/sysconfig/network-scripts/ifcfg-eth0
  • 【前端】--- ES6下篇（带你深入了解ES6语法） 心.c 前端es6ecmascript
    前言：ECMAScript是JavaScript的标准化版本，由ECMA国际组织制定。ECMAScript定义了JavaScript的语法、类型、语句、关键字、保留字等。ES6是ECMAScript的第六个版本，于2015年发布，引入了许多重要的新特性，使JavaScript更加现代化。进制ES6中增加了二进制和八进制的写法：二进制使用前缀'0b'或'0B'，八进制使用前缀'0o'或'0O'二进制
  • Linux搭建wordpress 长江空自流 vpslinuxwordpress安装
    Linux搭建wordpress一、环境vps：Centos6x86minimal512ram小内存xshell5：ssh远程连接主机首先搭建lamp环境（linuxapachemysqlphp或python等）二、apache1安装yuminstallhttpd2启动apacheservicehttpdstart直接在浏览器中输入IP地址，应该就可以访问到Apache的欢迎页面了三、mysql1
  • 如何在 Linux 系统中查看 CPU 核数和内存大小 Ryann6 linux运维服务器性能优化
    在日常运维和开发中，了解服务器或虚拟机的硬件配置是非常重要的一环。无论是进行性能调优，还是资源分配，了解CPU的核数和内存大小可以帮助我们更好地规划应用的运行环境。本篇博客将介绍如何在Linux系统中查看CPU核数和内存大小。一、查看CPU核数在Linux中，查看CPU信息可以使用lscpu和nproc命令。这两个命令提供了CPU详细的配置数据以及核心数量。1.使用lscpu命令lscpu是Lin
  • Linux pstree 命令详解 linuxlinux运维
    简介pstree命令用于以分层（树状）格式显示正在运行的进程。它显示进程之间的关系，例如哪些进程是由其他进程生成的。安装#基于Debian/Ubuntu的系统sudoaptinstallpsmisc#基于CentOS/RHEL/Fedora的系统sudoyuminstallpsmisc#使用dnf安装sudodnfinstallpsmisc基本语法pstree[options][pid|user]
  • Centos7配置vim-plug插件管理器与git安装 icacxygh001 vimcentoslinux
    LINUX下VIM是一款轻量级文本编辑器，功能强大作为开发者常用开发工具之一，本文目的通过安装vim-plug来管理插件，打造基于VIM的IDE继承开发环境，这个算是第一步吧，不废话了网上有很多关于如何安装vim-plug的教程，有些踩过的坑和大家分享下：1.安装步骤看到这里默认你的系统已经安装了vim编辑器（如何安装VIM这里不再阐述），往下看首先建立你要下载vim-plug的目录$mkdir-
  • Koodo Reader(跨平台电子书阅读器) v1.7.6 北十南五 电脑
    KoodoReader是一个跨平台的电子书阅读器。平台支持Windows，macOS，Linux和网页版，格式支持epub,pdf,mobi,azw3,txt,djvu,markdown,fb2,cbz,cbt,cbr,rtf和docx。软件特色支持阅读epub,pdf,mobi,azw3,txt,md,djvu,docx,rtf,cbz,cbr,cbt,fb2,html和xml格式的图书支持Wi
  • centos7中报错ModuleNotFoundError: No module named ‘_ctypes‘解决方法 丢失想象 centospython
    分析:python3中有个内置模块叫ctypes，它是python3的外部函数库模块，提供了兼容C语言的数据类型，并通过它调用Linux系统下的共享库(Sharedlibrary)，此模块需要使用centos7系统中外部函数库(Foreignfunctionlibrary)的开发链接库(头文件和链接库)。由于在centos7系统中没有安装外部函数库(libffi)的开发链接库软件包，所以在安装pi
  • 基于 WPF 平台使用纯 C# 实现动态处理 json 字符串 code_shenbing WPFwpfc#json
    一、引言在当今的软件开发领域，数据的交换与存储变得愈发频繁，JSON（JavaScriptObjectNotation）作为一种轻量级的数据交换格式，以其简洁、易读、便于解析和生成的特点，被广泛应用于各种应用程序中。在WPF（WindowsPresentationFoundation）平台开发的桌面应用里，我们常常需要与各种数据源交互，动态处理JSON字符串就成为了一项必备技能。本文将深入探讨如何
  • Vue.js 单页应用（SPA）开发教程：从零开始构建你的第一个项目 Milk夜雨 vue.jsvue.js前端javascript
    单页应用（SPA，SinglePageApplication）是现代前端开发的主流模式。Vue.js是一个非常适合构建SPA的框架，它通过VueRouter实现页面导航，通过组件化开发和状态管理实现复杂的交互功能。本篇教程将带你了解SPA的基本概念，并一步步创建一个Vue.js单页应用。什么是单页应用（SPA）？单页应用是一种只有一个HTML页面，通过JavaScript动态加载内容的应用。特点包
  • Node.js的解释 web15085415935 面试学习路线阿里巴巴node.js
    1.Node.js入门教程1.1什么是Node.js？1.1.1Node.js是什么？Node.js是一个基于JavaScript的开源服务器端运行时环境，允许开发者用JavaScript编写服务器端代码。与传统的前端JavaScript主要运行在浏览器端不同，Node.js通过提供一个非阻塞的异步模型，允许开发者在服务器端创建高性能的网络应用程序。比喻：想象你把JavaScript看作是一个厨师
  • 华为OD机试详解：分苹果问题的多语言实现与算法解析 m0_57781768 华为od算法
    华为OD机试详解：分苹果问题的多语言实现与算法解析在华为OD机试中，分苹果问题是典型的算法考题之一，考察了考生对于位运算的理解和应用。这道题的难点在于A和B两人的计算规则差异。A希望根据他的二进制加法规则来等分苹果，而B则希望在满足A的规则下，自己获得最多的苹果。本文将通过详细的解题思路及C++、Java、JavaScript、Python四种语言的实现，帮助你掌握这个问题的解决方法。题目描述A和
  • 参加【2025年春季】全国CTF夺旗赛-从零基础入门到竞赛，看这一篇就稳了！ 白帽子凯哥 web安全学习安全CTF夺旗赛网络安全
    基于入门网络安全/黑客打造的：黑客&网络安全入门&进阶学习资源包目录一、CTF简介二、CTF竞赛模式三、CTF各大题型简介四、CTF学习路线4.1、初期1、html+css+js（2-3天）2、apache+php（4-5天）3、mysql（2-3天）4、python(2-3天)5、burpsuite（1-2天）4.2、中期1、SQL注入（7-8天）2、文件上传（7-8天）3、其他漏洞（14-15
  • Flink之kafka消费数据 怎么才能努力学习啊 flinkkafka大数据
    场景：本地构建Flink程序问题描述消费Kafka的数据时，使用Flink新的KakfaSource。会报如下错误KafkaSourcekafkaSource=KafkaSource.builder().setBootstrapServers(kafkaProperties.getProperty("kafka.bootstrap.servers")).setTopics("test2").set
  • Windows 下Mamba2 环境安装问题记录及解决方法（causal_conv1d=1.4.0，mamba_ssm=2.2.2） yyywxk #Python模块有关问题mambapythonwindowsmamba2
    导航安装教程导航Mamba及Vim安装问题参看本人博客：Mamba环境安装踩坑问题汇总及解决方法（初版）Linux下Mamba及Vim安装问题参看本人博客：Mamba环境安装踩坑问题汇总及解决方法（重置版）Windows下Mamba的安装参看本人博客：Window下Mamba环境安装踩坑问题汇总及解决方法（无需绕过selective_scan_cuda）Linux下Vim安装问题参看本人博客：Li
  • Linux 下 Vim 环境安装踩坑问题汇总及解决方法（重置版） yyywxk #Python模块有关问题linuxvimmamba
    导航安装教程导航Mamba及Vim安装问题参看本人博客：Mamba环境安装踩坑问题汇总及解决方法（初版）Linux下Mamba及Vim安装问题参看本人博客：Mamba环境安装踩坑问题汇总及解决方法（重置版）Windows下Mamba的安装参看本人博客：Window下Mamba环境安装踩坑问题汇总及解决方法（无需绕过selective_scan_cuda）Linux下Vim安装问题参看本人博客：Li
  • PySide6的简单介绍 深蓝海拓 pyside6学习笔记pythonpyqtqt
    PySide6是一个用于创建图形用户界面(GUI)应用程序的软件开发工具包(SDK)，它是Qt框架的Python绑定。Qt是一个跨平台的C++图形用户界面应用程序开发框架，而PySide6允许开发者使用Python语言来实现Qt的功能。简单介绍1.跨平台性PySide6支持多个操作系统，包括Windows、macOS和Linux。这使得开发者可以编写一次代码，然后在不同平台上运行，而无需进行大量的
  • linux 实验感悟_linux实训总结(共10篇).docx 脑叔 linux实验感悟
    linux实训总结(共10篇)实习报告实习性质：linux操作系统课程实习学生姓名：xx专业班级：xx指导教师：xx实习时间：XX年12月16日-XX年12月20日实习地点：4112、4212、4312、4412重庆工程职业技术学院学生实习考核表目录1.实习目的.....................................................................
  • 1、wpa_supplicant介绍--配置参数说明 AryShaw ubuntulinux网络
    转载自：[https://zhuanlan.zhihu.com/p/674052171]，侵权请告知,立即删除。一、wpa_supplicant简介及使用：1.wpa_supplicant简介：wpa_supplicant是linux系统和android系统用来配置无线网络的开源工具，它是WPA的应用层认证客户端，负责完成WEP，WPA/WPA2和WAPI等无线协议认证相关的登录和加密等工作。wp
  • 打造高效React应用：CSS方案深度解析
    大家好，我是长林啊！一个爱好JavaScript、Go、Rust的全栈开发者；致力于终生学习和技术分享。在React以其声明式编程范式和组件化架构，成为了构建用户界面的首选技术之一。然而，随着项目规模的扩大和设计需求的多样化，如何高效地管理CSS样式成为了每个React开发者都需要面对的挑战。本文将从一下三个方面进行介绍，探讨如何在React中应用和管理样式，包括内联样式、CSS类、CSSModu
  • Windows Server 虚拟化环境中SR-IOV网络I/O增强功能 xidianjiapei001 虚拟化技术windows网络SR-IOV虚拟化IO虚拟化
    WindowsServer虚拟化环境中SR-IOV网络I/O增强功能目录详细文章症状原因解决方案受影响的产品总结：戴尔技术中心的戴尔操作系统和应用解决方案-包括ProjectSputnik、微软Windows、红帽Linux、SUSE、Ubuntu等详细文章症状微软在WindowsServer2012Beta操作系统中引入了对网络领域多项功能的支持。其中一项重要且有趣的功能是单根I/O虚拟化（SR
  • 使用基于 WebRTC 的 JavaScript API 在浏览器环境里调用本机摄像头
    Python中的class体内定义方法时，如果没有显式地包含self参数，有时候依然可以被调用。这是一个非常有趣的话题，因为它涉及到对Python中类与对象之间关系的更深理解。要理解为什么这种情况下方法依然能够被调用，我们需要逐步拆解Python类的构造方式以及方法绑定的原理。
  • 前端开发概述 不会写代码的菜 html前端html
    我们前后端工程师都一样,最终目的都是开发和维护软件,以给用户以更好的服务我们可以将软件分为以下几类:系统软件:WindowsLinuxmacOS应用软件:officeqq游戏软件:王者荣耀绝地求生我们的软件通常由服务器端和客户端组成客户端:通过客户端来使用软件,我们通常使用电脑时能看到的也就是客户端的软件,服务器端我们平常在使用过程中是无法看到的客户端的形式:文字客户端:一种古老的方式,通过命令行
  • React 前端框架简介与应用 仰望丨苍穹 前端：技巧与实践前端框架react.js前端
    React是一个用于构建用户界面的JavaScript库，在前端开发中被广泛应用。1：主要特点1.1：组件化开发React提倡以组件的方式构建用户界面。每个组件都具有独立的功能和逻辑，可以重复使用和组合，提高了开发效率和代码的可维护性。例如，一个网页中的导航栏、侧边栏、内容区域等都可以分别构建为不同的组件。1.2：虚拟DOMReact引入了虚拟DOM（VirtualDOM）的概念。当数据发生变化时
  • React 前端框架：简介与核心概念 一ge科研小菜鸡 工具前端框架
    React是由Facebook开发和维护的一个用于构建用户界面的JavaScript库。它专注于通过组件化的方式构建单页应用（SPA），允许开发者高效地创建复杂、交互性强的界面。React的核心特点是其虚拟DOM、组件化开发和声明式编程，使其成为目前最流行的前端开发框架之一。1.React的优势1.1组件化开发React的核心是组件（Component），它允许开发者将界面划分为多个独立的、可重用
  • 如何使用媒体查询实现响应式网页设计？ 破碎的天堂鸟 学习教程媒体css前端
    使用媒体查询（MediaQueries）实现响应式网页设计是现代网页开发中的一项核心技术，它允许开发者根据设备的屏幕尺寸、分辨率、方向等特性动态调整网页布局和样式，从而提供更好的用户体验。以下是详细说明如何使用媒体查询实现响应式网页设计的方法：1.媒体查询的基本概念媒体查询是CSS3引入的一项功能，通过@media规则，开发者可以根据设备的特性（如宽度、高度、方向等）应用不同的样式规则。媒体查询可
  • 如何通过减少HTTP请求来提升页面加载速度？ 破碎的天堂鸟 学习教程http网络协议网络
    通过减少HTTP请求可以显著提升网页加载速度，这是因为HTTP请求的次数直接影响了页面加载时间。以下是一些具体的方法和策略：1.合并文件将多个CSS文件合并为一个CSS文件，将多个JavaScript文件合并为一个JavaScript文件。这可以减少浏览器发起的HTTP请求次数，从而加快页面加载速度。示例：将所有样式表和脚本文件打包成一个文件，以减少请求数量。2.使用CSSSprites（雪碧图）
  • 【前端开发】前端开发深度解析：HTML、CSS、JavaScript与Vue.js RS迷途小书童 前端开发探索之旅javascripthtmlcss前端vue.js
    一、HTML：构建网页的基石1.1简介HTML（HyperTextMarkupLanguage，超文本标记语言）是一种用于创建网页的标准标记语言。它使用各种标签（tags）来描述网页上的内容，包括文本、图像、链接、视频、音频等。HTML是网页开发的基础，与CSS（层叠样式表）和JavaScript等技术一起，共同构建出丰富多彩的网页世界。HTML文档由一系列的元素构成，每个元素都由开始标签、内容和
  • js第一次笔记 chen_zhi_yu javascript笔记前端
    JavaScript显示方案JavaScript能够以不同方式“显示”数据：使用window.alert()写入警告框使用document.write()写入HTML输出使用innerHTML写入HTML元素使用console.log()写入浏览器控制台JavaScript关键词JavaScript语句常常通过某个关键词来标识需要执行的JavaScript动作。下面的表格列出了一部分将在教程中学到
  • 前端开发是随着互联网的发展而逐渐兴起的一种新的开发领域。它一直在不断地发展和演变，经历了许多重要的里程碑事件和技术革新，下面就来回顾一下前端开发的历程和发展趋势。 21级应用技术UI3班何珍锋 前端javascript前端框架
    一、Web1.0时代1990年代末到2000年代初，Web1.0时代是Web发展的初期阶段，这个阶段的Web界面设计以简单的文本和图像为主，用户的互动性和用户体验都很低。在这个时代，浏览器的前端技术主要是基于HTML和CSS的，HTML指的是超文本标记语言，而CSS则指的是层叠样式表。由于这些技术的简单性，前端开发者往往需要手动编写HTML和CSS代码，并进行基本的样式设计。二、Web2.0时代随
  • C/C++Win32编程基础详解视频下载 择善Zach 编程C++Win32
    课题视频：C/C++Win32编程基础详解 视频知识：win32窗口的创建                   windows事件机制 主讲：择善Uncle老师 学习交流群：386620625 验证码：625 --
  • Guava Cache使用笔记 bylijinnan javaguavacache
    1.Guava Cache的get/getIfPresent方法当参数为null时会抛空指针异常 我刚开始使用时还以为Guava Cache跟HashMap一样，get(null)返回null。 实际上Guava整体设计思想就是拒绝null的，很多地方都会执行com.google.common.base.Preconditions.checkNotNull的检查。 2.Guava
  • 解决ora-01652无法通过128（在temp表空间中） 0624chenhong oracle
    解决ora-01652无法通过128（在temp表空间中）扩展temp段的过程 一个sql语句后，大约花了10分钟，好不容易有一个结果，但是报了一个ora-01652错误，查阅了oracle的错误代码说明：意思是指temp表空间无法自动扩展temp段。这种问题一般有两种原因：一是临时表空间空间太小，二是不能自动扩展。 分析过程：    既然是temp表空间有问题，那当
  • Struct在jsp标签 不懂事的小屁孩 struct
    非UI标签介绍： 控制类标签： 1：程序流程控制标签   if   elseif    else <s:if test="isUsed"> <span class="label label-success">True</span> </
  • 按对象属性排序 换个号韩国红果果 JavaScript对象排序
    利用JavaScript进行对象排序，根据用户的年龄排序展示 <script> var bob={ name;bob, age:30 } var peter={ name;peter, age:30 } var amy={ name;amy, age:24 } var mike={ name;mike, age:29 } var john={
  • 大数据分析让个性化的客户体验不再遥远 蓝儿唯美 数据分析
    顾客通过多种渠道制造大量数据，企业则热衷于利用这些信息来实现更为个性化的体验。 分析公司Gartner表示，高级分析会成为客户服务的关键，但是大数据分析的采用目前仅局限于不到一成的企业。 挑战在于企业还在努力适应结构化数据，疲于根据自身的客户关系管理（CRM）系统部署有效的分析框架，以及集成不同的内外部信息源。 然而，面对顾客通过数字技术参与而产生的快速变化的信息，企业需要及时作出反应。要想实
  • java笔记4 a-john java
    操作符 1，使用java操作符       操作符接受一个或多个参数，并生成一个新值。参数的形式与普通的方法调用不用，但是效果是相同的。加号和一元的正号（+）、减号和一元的负号（-）、乘号（*）、除号（/）以及赋值号（=）的用法与其他编程语言类似。       操作符作用于操作数，生成一个新值。另外，有些操作符可能会改变操作数自身的
  • 从裸机编程到嵌入式Linux编程思想的转变------分而治之：驱动和应用程序 aijuans 嵌入式学习
        笔者学习嵌入式Linux也有一段时间了，很奇怪的是很多书讲驱动编程方面的知识，也有很多书将ARM9方面的知识，但是从以前51形式的（对寄存器直接操作，初始化芯片的功能模块）编程方法，和思维模式，变换为基于Linux操作系统编程，讲这个思想转变的书几乎没有，让初学者走了很多弯路，撞了很多难墙。     笔者因此写上自己的学习心得，希望能给和我一样转变
  • 在springmvc中解决FastJson循环引用的问题 asialee 循环引用fastjson
              我们先来看一个例子：           package com.elong.bms; import java.io.OutputStream; import java.util.HashMap; import java.util.Map; import co
  • ArrayAdapter和SimpleAdapter技术总结 百合不是茶 androidSimpleAdapterArrayAdapter高级组件基础
    ArrayAdapter比较简单，但它只能用于显示文字。而SimpleAdapter则有很强的扩展性，可以自定义出各种效果   ArrayAdapter;的数据可以是数组或者是队列        // 获得下拉框对象 AutoCompleteTextView textview = (AutoCompleteTextView) this
  • 九封信 bijian1013 人生励志
            有时候，莫名的心情不好，不想和任何人说话，只想一个人静静的发呆。有时候，想一个人躲起来脆弱，不愿别人看到自己的伤口。有时候，走过熟悉的街角，看到熟悉的背影，突然想起一个人的脸。有时候，发现自己一夜之间就长大了。         2014，写给人
  • Linux下安装MySQL Web 管理工具phpMyAdmin sunjing PHPInstallphpMyAdmin
    PHP http://php.net/ phpMyAdmin http://www.phpmyadmin.net Error compiling PHP on CentOS x64   一、安装Apache 请参阅http://billben.iteye.com/admin/blogs/1985244   二、安装依赖包 sudo yum install gd
  • 分布式系统理论 bit1129 分布式
    FLP One famous theory in distributed computing, known as FLP after the authors Fischer, Lynch, and Patterson, proved that in a distributed system with asynchronous communication and process crashes,
  • ssh2整合(spring+struts2+hibernate)-附源码 白糖_ eclipsespringHibernatemysql项目管理
    最近抽空又整理了一套ssh2框架，主要使用的技术如下： spring做容器，管理了三层(dao,service,actioin)的对象 struts2实现与页面交互(MVC)，自己做了一个异常拦截器，能拦截Action层抛出的异常 hibernate与数据库交互 BoneCp数据库连接池，据说比其它数据库连接池快20倍，仅仅是据说 MySql数据库   项目用eclipse
  • treetable bug记录 braveCS table
    // 插入子节点删除再插入时不能正常显示。修改： //不知改后有没有错，先做个备忘 Tree.prototype.removeNode = function(node) { // Recursively remove all descendants of +node+ this.unloadBranch(node); // Remove
  • 编程之美-电话号码对应英语单词 bylijinnan java算法编程之美
    import java.util.Arrays; public class NumberToWord { /** * 编程之美 电话号码对应英语单词 * 题目： * 手机上的拨号盘，每个数字都对应一些字母，比如2对应ABC，3对应DEF.........，8对应TUV，9对应WXYZ， * 要求对一段数字，输出其代表的所有可能的字母组合
  • jquery ajax读书笔记 chengxuyuancsdn jQuery ajax
    1、jsp页面 <%@ page language="java" import="java.util.*" pageEncoding="GBK"%> <% String path = request.getContextPath(); String basePath = request.getScheme()
  • JWFD工作流拓扑结构解析伪码描述算法 comsci 数据结构算法工作活动J#
      对工作流拓扑结构解析感兴趣的朋友可以下载附件，或者下载JWFD的全部代码进行分析   /*  流程图拓扑结构解析伪码描述算法         public java.util.ArrayList DFS(String graphid, String stepid, int j)
  • oracle I/O 从属进程 daizj oracle
    I/O 从属进程 　　I/O从属进程用于为不支持异步I/O的系统或设备模拟异步I/O.例如，磁带设备(相当慢)就不支持异步I/O.通过使用I/O 从属进程，可以让磁带机模仿通常只为磁盘驱动器提供的功能。就好像支持真正的异步I/O 一样，写设备的进程(调用者)会收集大量数据，并交由写入器写出。数据成功地写出时，写入器(此时写入器是I/O 从属进程，而不是操作系统)会通知原来的调用者，调用者则会
  • 高级排序:希尔排序 dieslrae 希尔排序
    public void shellSort(int[] array){ int limit = 1; int temp; int index; while(limit <= array.length/3){ limit = limit * 3 + 1;
  • 初二下学期难记忆单词 dcj3sjt126com englishword
    kitchen 厨房 cupboard 厨柜 salt 盐 sugar 糖 oil 油 fork 叉；餐叉 spoon 匙；调羹 chopsticks 筷子 cabbage 卷心菜；洋白菜 soup 汤 Italian 意大利的   Indian 印度的 workplace  工作场所 even 甚至；更 Italy 意大利 laugh 笑 m
  • Go语言使用MySQL数据库进行增删改查 dcj3sjt126com mysql
    目前Internet上流行的网站构架方式是LAMP，其中的M即MySQL, 作为数据库，MySQL以免费、开源、使用方便为优势成为了很多Web开发的后端数据库存储引擎。MySQL驱动Go中支持MySQL的驱动目前比较多，有如下几种，有些是支持database/sql标准，而有些是采用了自己的实现接口,常用的有如下几种: http://code.google.c...o-mysql-dri
  • git命令 shuizhaosi888 git
    ---------------设置全局用户名： git config --global user.name "HanShuliang" //设置用户名 git config --global user.email "[email protected]" //设置邮箱 ---------------查看环境配置 git config --li
  • qemu-kvm 网络 nat模式 (四) haoningabc kvmqemu
    qemu-ifup-NAT #!/bin/bash BRIDGE=virbr0 NETWORK=192.168.122.0 GATEWAY=192.168.122.1 NETMASK=255.255.255.0 DHCPRANGE=192.168.122.2,192.168.122.254 TFTPROOT= BOOTP= function check_bridge()
  • 不要让未来的你，讨厌现在的自己 jingjing0907 生活 奋斗 工作 梦想
     故事one 　23岁，他大学毕业，放弃了父母安排的稳定工作，独闯京城，在家小公司混个小职位，工作还算顺手，月薪三千，混了混，混走了一年的光阴。　　　　24岁，有了女朋友，从二环12人的集体宿舍搬到香山民居，一间平房，二人世界，爱爱爱。偶然约三朋四友，打扑克搓麻将，日子快乐似神仙；　　　　25岁，出了几次差，调了两次岗，薪水涨了不过百，生猛狂飙的物价让现实血淋淋，无力为心爱银儿购件大牌
  • 枚举类型详解 一路欢笑一路走 enum枚举详解enumsetenumMap
    枚举类型详解 一.Enum详解      1.1枚举类型的介绍   JDK1.5加入了一个全新的类型的”类”—枚举类型，为此JDK1.5引入了一个新的关键字enum,我们可以这样定义一个枚举类型。      Demo:一个最简单的枚举类   public enum ColorType { RED
  • 第11章 动画效果（上） onestopweb 动画
    index.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/
  • Eclipse中jsp、js文件编辑时，卡死现象解决汇总 ljf_home eclipsejsp卡死js卡死
    使用Eclipse编辑jsp、js文件时，经常出现卡死现象，在网上百度了N次，经过N次优化调整后，卡死现象逐步好转，具体那个方法起到作用，不太好讲。将所有用过的方法罗列如下：   1、取消验证 windows–>perferences–>validation 把 除了manual 下面的全部点掉，build下只留 classpath dependency Valida
  • MySQL编程中的6个重要的实用技巧 tomcat_oracle mysql
    每一行命令都是用分号(;)作为结束 对于MySQL，第一件你必须牢记的是它的每一行命令都是用分号(;)作为结束的，但当一行MySQL被插入在PHP代码中时，最好把后面的分号省略掉，例如： mysql_query("INSERT INTO tablename(first_name,last_name)VALUES('$first_name',$last_name')");
  • zoj 3820 Building Fire Stations(二分+bfs) 阿尔萨斯 Build
    题目链接：zoj 3820 Building Fire Stations 题目大意：给定一棵树，选取两个建立加油站，问说所有点距离加油站距离的最大值的最小值是多少，并且任意输出一种建立加油站的方式。 解题思路：二分距离判断，判断函数的复杂度是o(n)，这样的复杂度应该是o(nlogn)，即使常数系数偏大，但是居然跑了4.5s，也是醉了。 判断函数里面做了3次bfs，但是每次bfs节点最多
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他