G.di

flex布局

文章目录

前言
一、flex布局体验
二、flex布局原理
三、flex布局父项常见属性
- 1.flex-direction设置主轴的方向
- 2.justify-content主轴上子元素排列方式
- 3.flex-wrap设置子元素是否换行
- 4.align-items侧轴上的子元素排列方式（单行）
- 5.align-content侧轴子元素排列方式（多行）
- 6.flex-flow复合属性
四、flex布局子项常见属性
- 1.flex属性
- 2.align-self属性
- 3.order属性
总结

前言

这部分学习flex布局，还是通过写一个移动端网页进行练习，这里就只记录理论知识啦。

提示：以下是本篇文章正文内容，下面案例可供参考

一、flex布局体验

传统布局：
（1）兼容性好
（2）布局繁琐
（3）局限性，不能在移动端很好的布局
flex布局：
（1）操作方便，布局极为简单，移动端应用广泛
（2）pc端浏览器支持情况较差
（3）IE11或更低版本，不支持或仅部分支持
建议：
（1）pc端页面使用传统布局
（2）移动端或者是不考虑兼容性问题的pc端，使用flex弹性布局
代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=\, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
     
            margin: 0;
            padding: 0;
        }
        div {
     
            display: flex;
            width: 800px;
            height: 200px;
            background-color: pink;
        }
        div span {
     
            width: 150px;
            height: 100px;
            background-color: rebeccapurple;
        }
    </style>
</head>
<body>
    <div>
        <span>1</span>
        <span>2</span>
        <span>3</span>
    </div>
</body>
</html>

二、flex布局原理

采用flex布局元素，成为flex容器，简称容器。他的所有子元素自动称为容器成员，成为flex项目，简称项目。
通过给父盒子添加flex属性，来控制子盒子的位置和排列方式。

三、flex布局父项常见属性

1.flex-direction设置主轴的方向

默认主轴方向就是x轴方向，水平向右；侧轴方向就是y轴方向，垂直向下。
注意：主轴和侧轴是会发生变化的，就看flex-direction设置谁为主轴，剩下的就是侧轴。子元素是跟着主轴来排列的。

代码如下（示例）：

/* 默认主轴方向从左往右 */
flex-direction: row; 
/* 主轴方向从右往左 */
flex-direction: row-reverse;
/* 主轴方向从上往下 */
flex-direction: column; 
/* 主轴方向从下往上 */
flex-direction: column-reverse;

2.justify-content主轴上子元素排列方式

代码如下（示例）：

/* 从主轴开始位置对齐  */
justify-content: flex-start; 
/* 从主轴结束位置对齐 */
justify-content: flex-end;
/* 位于主轴居中对齐 */
justify-content: center;
/* 平分主轴剩余空间 */
justify-content: space-around;
/* 两边贴边对齐，剩余子项目平分剩余空间 */
justify-content: space-between;

3.flex-wrap设置子元素是否换行

代码如下（示例）：

/* 默认不换行 */
flex-wrap: nowrap;
/* 换行进行显示 */
flex-wrap: wrap;

4.align-items侧轴上的子元素排列方式（单行）

代码如下（示例）：

/* 默认侧轴上从上往下排列 */
align-items: flex-start;
/* 从下往上加载 */
align-items: flex-end;
/* 居中加载 */
align-items: center;
/* 拉伸 */
align-items: stretch;

5.align-content侧轴子元素排列方式（多行）

代码如下（示例）：

/* 侧轴整体位于开始位置 */
align-content: flex-start;
/* 侧轴整体位于结束位置 */
align-content: flex-end;
/* 侧轴位于居中位置 */
align-content: center;
/* 侧轴拉伸 */
align-content: stretch;
/* 平均分布 */
align-content: space-around;
/* 上下对齐，剩余空间给剩下的子项目平局分布 */
align-content: space-between;

总结：
align-items属性只适合单行，只有上对齐，下对齐，居中和拉伸；
align-content属性适合多行，有上对齐，下对齐，居中，拉伸以及平均分配剩余空间的属性值。

6.flex-flow复合属性

代码如下（示例）：

/* flex-direction: row; */
/* 换行进行显示 */
/* flex-wrap: wrap;  */
flex-flow: row wrap;

四、flex布局子项常见属性

1.flex属性

子项目分配父盒子的剩余空间，属性值为数字，1代表占总分中的一份，默认值为0。
代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
     
            margin: 0;
            padding: 0;
        }
        section {
     
            display: flex;
            width: 80%;
            height: 80px;
            margin: 10px auto;
            background-color: pink;
        }
        section div:nth-child(1),section div:nth-child(3) {
     
            width: 80px;
            height: 80px;
            background-color: purple;
        }
        section div:nth-child(2) {
     
            flex: 1;
            height: 80px;
            background-color: salmon;
        }
    </style>
</head>
<body>
    <section>
        <div>1</div>
        <div>2</div>
        <div>3</div>
    </section>
</body>
</html>

效果展示：

2.align-self属性

允许单个子项目有与其他子项目不同的对齐方式。默认值为auto，表示继承父元素的align-items，如果没有父元素等同于stretch。
代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=\, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
     
            margin: 0;
            padding: 0;
        }
        div {
     
            display: flex;
            width: 800px;
            height: 500px;
            background-color: pink;
            /* 默认主轴方向从左往右 */
            flex-direction: row;
            justify-content: center;
            align-items: flex-start;
        }
        div span {
     
            width: 150px;
            height: 100px;
            background-color: rebeccapurple;
        }
        div span:nth-child(2) {
     
            align-self: flex-end;
        }
    </style>
</head>
<body>
    <div>
        <span>1</span>
        <span>2</span>
        <span>3</span>
    </div>
</body>
</html>

效果展示

3.order属性

定义项目在加载时，有自己的先后顺序。属性值为数值，数字越小越靠前，默认值为0

代码如下（示例）：

div span:nth-child(2) {
     
    /* 往前面调，属性值要小于零 */
    /* order: -1; */
    /* 往后调顺序 */
    order: 2;
}

效果展示

总结

流式布局就学习到这里啦，自己做一个项目来进行练习，这里就不展示了。每天坚持学习前端。

你可能感兴趣的:(移动端网页,前端学习,flex布局,flex,html,css)

OpenHarmony外设驱动移植指南你我皆是牛马星人鸿蒙开发 HarmonyOS OpenHarmony harmonyos OpenHarmony 鸿蒙开发源码分析迁移学习嵌入式硬件驱动开发
往期推文全新看点（文中附带最新·鸿蒙全栈学习笔记）鸿蒙（HarmonyOS）北向开发知识点记录~鸿蒙（OpenHarmony）南向开发保姆级知识点汇总~鸿蒙应用开发与鸿蒙系统开发哪个更有前景？嵌入式开发适不适合做鸿蒙南向开发？看完这篇你就了解了~对于大前端开发来说，转鸿蒙开发究竟是福还是祸？鸿蒙岗位需求突增！移动端、PC端、IoT到底该怎么选？记录一场鸿蒙开发岗位面试经历~持续更新中……外设驱动子
【OpenHarmony】鸿蒙开发：轻量系统服务管理|存储机制详解(一) 你我皆是牛马星人 HarmonyOS 鸿蒙开发 OpenHarmony harmonyos 鸿蒙开发 OpenHarmony 嵌入式硬件 SAStore模块物联网
往期推文全新看点（文中附带最新·鸿蒙全栈学习笔记）鸿蒙（HarmonyOS）北向开发知识点记录~鸿蒙（OpenHarmony）南向开发保姆级知识点汇总~鸿蒙应用开发与鸿蒙系统开发哪个更有前景？嵌入式开发适不适合做鸿蒙南向开发？看完这篇你就了解了~对于大前端开发来说，转鸿蒙开发究竟是福还是祸？鸿蒙岗位需求突增！移动端、PC端、IoT到底该怎么选？记录一场鸿蒙开发岗位面试经历~持续更新中……一、前言本
Android音视频探索之旅 | Webrtc 1对1音视频通话核心流程分析慢行的骑兵音视频 android 音视频 webrtc
一.前言使用Webrtc实现1对1的音视频通话，先从Web端进行学习要比直接从Android端进行学习要轻松许多（若没有JS和Html以及Node基础，查找相关基础教程，能梳理代码的逻辑即可）。本文Android端接入Webrtc是通过引入官方的sdk来实现的。本文涉及到的Demo代码包含三部分，服务器端、Web端、Android端。服务器端使用的是Node，Web使用的是Html和JS，Andr
Linux 基本指令详解 Cherl. Linux linux 运维服务器基本命令
1.pwd（PrintWorkingDirectory）显示当前工作目录的完整路径root@hcss-ecs-a3f4:~#pwd/root2.ls（List）列出目录内容ls#查看当前目录下文件和文件夹ls-l#长格式显示(显示权限、所有者、大小、修改时间等)ls-a#显示所有文件(包括隐藏文件)ls-la#长格式显示所有文件ls-lh#以人类可读的方式显示文件大小ls-R#递归显示子目录ll为
Python 服务器端与客户端的加密通信（SSL/TLS）解析现实逃脱计划TA python ssl 网络
```htmlPython服务器端与客户端的加密通信（SSL/TLS）解析在当今互联网时代，数据安全变得越来越重要。为了保护数据在传输过程中的安全，使用SSL/TLS协议进行加密通信成为了一种常见的做法。本文将详细介绍如何在Python中实现服务器端和客户端之间的SSL/TLS加密通信。什么是SSL/TLS？SSL（SecureSocketsLayer）和TLS（TransportLayerSec
vue中实现验证码输入结城 vue 验证码 vue输入框
vue验证码input输入解决焦点切换有点晚了就不吐槽了，咱还是把代码上了，赶紧洗澡，养好精神明天努力上班！！！想学node,想学react,想精进webpack,想vue学的更好一点，了解底层代码，学算法，学计算机原理，想写自己的博客网站…这是一条学无止境的路，没办法要恰饭效果html部分js部分exportdefault{props:{inputNums:{type:Number,defaul
聊聊 iframe：网页中的“窗口”是怎么回事？结城前端前端 html
在网页开发中，是一个挺常见但又有点“低调”的HTML标签。你可能在浏览网页时见过它，比如嵌入的YouTube视频、地图，或者一些外部的小工具。它就像网页里开了一扇小窗口，能把另一个网页的内容嵌进来。今天就来聊聊iframe的前世今生、怎么用、包括srcdoc的妙用，它在微前端、传统后端开发、打印场景、通信机制中的应用，以及如何防止别人用iframe内嵌你的网站，尽量说得自然又接地气。iframe是
微信小程序软键盘弹出的问题结城 javascript 小程序
微信小程序软键盘弹出的问题这里记录一个微信中开发的一个小问题，1.当我开发这个页面功能的时候在缩小的状态正常情况聚焦时在手机上会有一个软键盘弹出来完全遮住了我textarea输入框2.遮住状态这个时候我们还发现页面被顶了上去，头部的导航栏没有了3.解决问题html部分/防止页面被顶我们使用adjust-position属性js部分//并且加入失去焦点，得到焦点事件，通过bindfocus事件对象我
超简单linux上部署Apache 悟空骑猪看电影 apache linux 运维网络
1.Apache是什么？Apache是世界上最流行的开源Web服务器软件，由Apache软件基金会维护。主要功能：接收客户端（如浏览器）的HTTP请求，返回网页、图片等静态/动态资源。特点：跨平台（Linux、Windows、macOS）模块化设计（按需加载功能）支持多语言扩展（PHP、Python等）高稳定性和安全性2.核心架构与工作原理多进程模型（MPM）Prefork：多进程模式，每个请求由
python启动其他程序或命令（pandoc） SUN_SU3 python
编写python脚本时，有些功能由其他程序执行，直接在python脚本中启动对应的程序或命令执行即可，现记录用过的几种方法：查看程序的安装目录：whichpandoc1）subprocess:importsubprocessa=subprocess.Popen(['/opt/***/pandoc','/home/***/test.docx','-o','/home/***/test.html'])
Kubernetes 高级调度 02 别骂我h kubernetes 容器云原生
一、Taint（污点）和Toleration（容忍）在生产环境中，经常会有这样的需求：master节点只部署系统组件容器，比如Calico、MetricsServer、Dashboard等，不应该部署业务应用。新添加节点不应该立即就允许部署业务容器，也就是新节点需要经过完整性及稳定性测试才可以被允许调度。某些节点可能需要进行系统升级或者其他维护，可能会引起节点上的容器不可用，此时需要将该节点上的P
web第一次作业这日光醉了城. 前端 javascript 开发语言
实现一个登录页面、实现一个注册页面；实现一个主页-登录页面：`login.html`-注册页面：`register.html`-主页：`index.html`要求如下：-主页中，可以点击**注册**或者**登录**能直接在新窗口跳转到对应的页面-登录页面中，输入账号、密码可以点击登录-自动跳转到主页-注册页面中，输入账号、密码、确认密码、昵称，点击注册，注册后自动跳转到登录页面login.html
docker部署dm数据库 yy1209357299 运维 Linux docker 容器运维 dm
官方文档参考官网地址：https://eco.dameng.com/document/dm/zh-cn/start/dm-install-docker.html下载镜像地址docker部署1、加载镜像dockerload-idm8_20240613_x86_rh6_64_rq_ent_8.1.3.140_pack5.tar使用dockerimages，查看镜像和镜像标签2、创建路径，挂载备用mkd
Linux指令大全网站
Linux指令大全网站！Linux命令大全(手册)：超全！且提供指令查询网址：https://www.linuxcool.com/Linux指令(菜鸟教程)：超全！提供清晰的表格查找网址：https://www.runoob.com/linux/linux-command-manual.htmlLinux中文在线手册：这个网站可以检索Linux命令，提供了命令的例子和收藏命令的搜索平台网址：htt
盘点一个Python网络爬虫过程中中文乱码的问题皮皮_f075
大家好，我是皮皮。一、前言前几天在Python白银交流群【空翼】问了一个Python网络爬虫中文乱码的问题，提问截图如下：原始代码如下：importrequestsimportparselurl='https://news.p2peye.com/article-514723-1.html'headers={'Accept-Language':'zh-CN,zh;q=0.9','Accept':'a
uniapp使用uni-ui怎么修改默认的css样式比如多选框及样式覆盖小程序/安卓/ios兼容问题禾苗种树 uni-app ui css scss
修改uni-ui多选框(uni-data-checkbox)的默认样式在uniapp中使用uni-ui的uni-data-checkbox组件时，可以通过以下几种方式修改其默认样式：方法一：使用深度选择器格式一：在页面的style部分使用深度选择器>>>或/deep/来穿透组件作用域：/*在普通CSS中*/>>>#rememberbox.uni-checkbox-input{border-colo
uview-ui使用u-row+u-avatar居中布局 cherishSpring uniapp javascript 前端 css
1、效果图2、页面代码{{str}}exportdefault{data(){return{txt:['景点','酒店','攻略','视频']}},methods:{}}.align-center{display:flex;justify-content:center;align-items:center;}
脚本代码：网页限制解除(改) vvandre edge chrome firefox 前端
修改版描述：作者@qxini通杀大部分网站,可以解除禁止复制、剪切、选择文本、右键菜单的限制。原作者cat73,因为和搜索跳转脚本冲突,遂进行了改动。源脚本有个很大的坑，应该只在有限制的网站使用，类似360doc，知乎这类，建立一个黑名单，只对黑名单上的网站使用。而不是像现在这样全网通杀。尝试着处理了下，和之前脚本变化很大，之前是白名单制度，针对哪些网站不启用，其他网站一律使用脚本，现在是黑名单制
关于浏览器扩展脚本：remove-web-limits(网页限制解除) vvandre 前端
本文介绍浏览器扩展脚本：remove-web-limits(网页限制解除)实现的功能和安装步骤，还会详细分析脚本的代码，让你对实现原理一目了然。此脚本通杀大部分网站，可以解除禁止复制、剪切、选择文本、右键菜单的限制。脚本基本不影响网页正常功能，如果影响了任何功能，可以暂时禁用脚本解决。脚本已有10年的历史，原作者已经暂停维护。remove-web-limits发布地址一、安装步骤1.安装扩展程序C
Javaweb笔记笙鹿鸣 html 前端 html5
HTMLHTML网页常用基础知识网页结构JavaSEC/SClientserver客户端–服务器JavaWebB/SBroswerServer浏览器–服务器网页的组成部分：内容（结构）、表现、行为HTML:HyperTextMarkupLanguage(超文本标记语言)ALT+F2选择浏览器HTML书写规范：表示整个html页面的开始头信息标题标题body是页面的主体内容页面主体内容表示整个htm
从5G到6G：AI算力网络将如何改变通信行业？ AI算力网络与通信 AI算力网络与通信原理 AI人工智能大数据架构 AI人工智能与大数据技术 5G 人工智能网络 ai
从5G到6G：AI算力网络将如何改变通信行业？关键词：5G、6G、AI算力网络、边缘计算、智能编排、数字孪生、通信革命摘要：从2G打电话到3G刷网页，从4G看视频到5G连万物，通信技术的每一次跃迁都在重塑人类的生活方式。如今，5G已进入规模商用期，6G研发正如火如荼推进。本文将带您走进“连接+算力+智能”三位一体的未来通信世界，揭秘AI算力网络如何从“幕后助手”变为“核心引擎”，推动通信行业从“管
python 抓取小红书小五咔咔咔 python 开发语言
python相关学习资料：https://edu.51cto.com/video/3832.htmlhttps://edu.51cto.com/video/4102.htmlhttps://edu.51cto.com/video/1158.htmlPython抓取小红书数据的科普文章小红书是一个流行的社交电商平台，用户可以分享购物心得、生活点滴等。本文将介绍如何使用Python语言抓取小红书的数据
四十行Python代码，带你爬取热门音乐评论，制作评论词云图！
请求页面数据driver.get(‘https://music.163.com/#/song?id=569213220’)#selenium无法直接获取到嵌套页面里面的数据switch_to.frame()切换到嵌套网页driver.switch_to.frame(0)让浏览器加载的时候,等待渲染页面driver.implicitly_wait(10)driver.page_source获取请求页
poi html转换成word文档,poi将html转换为word文档天猪飞翔 poi html转换成word文档
如何使用apachepoi将word转化为htmlJava可以使用这个开源框架，对word进行读取合并等操作，ApachePOI是一个开源的利用Java读写Excel、WORD等微软OLE2组件文档的项目。最新的3.5版本有很多改进，加入了对采用OOXML格式的Office2007支持，如xlsx、docx、pptx文档。示例如下：importorg.apache.poi.POITextExtra
社交应用全栈开发实战：前后端与数据库整合
本文还有配套的精品资源，点击获取简介：本资源包详细介绍了构建一个社交应用程序的全过程，包括前端、后端以及数据库管理的核心组件和关键功能。Uniapp框架用于开发跨平台的移动端用户界面，Java后端负责处理业务逻辑和数据交互，MySQL数据库用于管理用户信息和动态数据。项目还包括前后端通信、身份验证、性能优化和推送通知服务的实现。学习这些代码可以提升开发者的技能，帮助快速构建社交应用。1.社交APP
No module named "Crypto"，如何安装Python三方模块Crypto weixin_30342827 python 操作系统
前两天公司公司老总让我研究怎么用企业微信第三方应用进行官网对接，完成URL回调验证问题。具体如何进行Python的Django网站与企业微信第三方应用进行回调验证的博客地址为：https://www.cnblogs.com/ws17345067708/p/10522472.html这里讲讲，如何在win10下，安装一个非常坑爹的加密算法库，名字叫"Crypto"看了好多博客，没有一个管用的，要么就
Three.js入门：创建第一个3D场景薯条说影 Three.js 3D场景创建跨平台设置安全异常处理 HTML骨架搭建
背景简介Three.js是一个轻量级的3D图形库，它让Web开发者能够在浏览器中创建和显示3D图形。本章介绍如何设置环境以开始使用Three.js，包括不同操作系统下的安装步骤、安全异常处理以及基本的HTML骨架创建。安装与设置操作系统兼容性：Three.js的使用不仅限于Windows系统。对于其他操作系统，如Linux和MacOS，需要将可执行文件复制到目标目录，并通过命令行启动。无论是哪种操
爬虫_加速乐秒杀 kisloy 爬虫逆向爬虫 python
加速乐补环境补环境window={navigator:{userAgent:"Mozilla/5.0(WindowsNT10.0;Win64;x64)AppleWebKit/537.36(KHTML,likeGecko)Chrome/104.0.0.0Safari/537.36"},outerWidth:1920,outerHeight:1050,};location={reload:functi
网页返回title“Just a moment...“，python 绕过tls指纹的几种方式记录一下
第一种：使用tls_client第三方库进行绕过importtls_clientsession=tls_client.Session(ja3_string="771,4865-4866-4867-49195-49199-49196-49200-52393-52392-49171-49172-156-157-47-53,0-23-65281-10-11-35-16-5-13-18-51-45-43-
python如何抓取网页里面的文字_如何利用python抓取网页文字、图片内容？ weixin_39917437
想必新老python学习者，对爬虫这一概念并不陌生，在如今大数据时代，很多场景都需要利用爬虫去爬取数据，而这刚好时python领域，如何实现？怎么做？一起来看下吧~获取图片：1、当我们浏览这个网站时，会发现，每一个页面的URL都是以网站的域名+page+页数组成，这样我们就可以逐一的访问该网站的网页了。2、当我们看图片列表时中，把鼠标放到图片，右击检查，我们发现，图片的内容由ul包裹的li组成，箭
html 周华华 html
js 1，数组的排列 var arr=[1,4,234,43,52,]; for(var x=0;x<arr.length;x++){ for(var y=x-1;y<arr.length;y++){ if(arr[x]<arr[y]){ &
【Struts2 四】Struts2拦截器 bit1129 struts2拦截器
Struts2框架是基于拦截器实现的，可以对某个Action进行拦截，然后某些逻辑处理，拦截器相当于AOP里面的环绕通知，即在Action方法的执行之前和之后根据需要添加相应的逻辑。事实上，即使struts.xml没有任何关于拦截器的配置，Struts2也会为我们添加一组默认的拦截器，最常见的是，请求参数自动绑定到Action对应的字段上。 Struts2中自定义拦截器的步骤是：
make:cc 命令未找到解决方法 daizj linux 命令未知 make cc
安装rz sz程序时，报下面错误： [root@slave2 src]# make posix cc -O -DPOSIX -DMD=2 rz.c -o rz make: cc：命令未找到 make: *** [posix] 错误 127 系统：centos 6.6 环境：虚拟机错误原因：系统未安装gcc，这个是由于在安
Oracle之Job应用周凡杨 oracle job
最近写服务，服务上线后，需要写一个定时执行的SQL脚本，清理并更新数据库表里的数据，应用到了Oracle 的 Job的相关知识。在此总结一下。一：查看相关job信息 1、相关视图 dba_jobs all_jobs user_jobs dba_jobs_running 包含正在运行
多线程机制朱辉辉33 多线程
转至http://blog.csdn.net/lj70024/archive/2010/04/06/5455790.aspx 程序、进程和线程：程序是一段静态的代码，它是应用程序执行的蓝本。进程是程序的一次动态执行过程，它对应了从代码加载、执行至执行完毕的一个完整过程，这个过程也是进程本身从产生、发展至消亡的过程。线程是比进程更小的单位，一个进程执行过程中可以产生多个线程，每个线程有自身的
web报表工具FineReport使用中遇到的常见报错及解决办法（一）老A不折腾 web报表 finereport java报表报表工具
FineReport使用中遇到的常见报错及解决办法（一）这里写点抛砖引玉，希望大家能把自己整理的问题及解决方法晾出来，Mark一下，利人利己。出现问题先搜一下文档上有没有，再看看度娘有没有，再看看论坛有没有。有报错要看日志。下面简单罗列下常见的问题，大多文档上都有提到的。 1、address pool is full：含义：地址池满，连接数超过并发数上
mysql rpm安装后没有my.cnf 林鹤霄没有my.cnf
Linux下用rpm包安装的MySQL是不会安装/etc/my.cnf文件的，至于为什么没有这个文件而MySQL却也能正常启动和作用，在这儿有两个说法，第一种说法，my.cnf只是MySQL启动时的一个参数文件，可以没有它，这时MySQL会用内置的默认参数启动，第二种说法，MySQL在启动时自动使用/usr/share/mysql目录下的my-medium.cnf文件，这种说法仅限于r
Kindle Fire HDX root并安装谷歌服务框架之后仍无法登陆谷歌账号的问题 aigo root
原文：http://kindlefireforkid.com/how-to-setup-a-google-account-on-amazon-fire-tablet/ Step 4: Run ADB command from your PC On the PC, you need install Amazon Fire ADB driver and instal
javascript 中var提升的典型实例 alxw4616 JavaScript
// 刚刚在书上看到的一个小问题,很有意思.大家一起思考下吧 myname = 'global'; var fn = function () { console.log(myname); // undefined var myname = 'local'; console.log(myname); // local }; fn() // 上述代码实际上等同于以下代码 m
定时器和获取时间的使用百合不是茶时间的转换定时器
定时器:定时创建任务在游戏设计的时候用的比较多 Timer();定时器 TImerTask();Timer的子类由 Timer 安排为一次执行或重复执行的任务。定时器类Timer在java.util包中。使用时，先实例化，然后使用实例的schedule(TimerTask task, long delay)方法，设定
JDK1.5 Queue bijian1013 java thread java多线程 Queue
JDK1.5 Queue LinkedList： LinkedList不是同步的。如果多个线程同时访问列表，而其中至少一个线程从结构上修改了该列表，则它必须保持外部同步。（结构修改指添加或删除一个或多个元素的任何操作；仅设置元素的值不是结构修改。）这一般通过对自然封装该列表的对象进行同步操作来完成。如果不存在这样的对象，则应该使用 Collections.synchronizedList 方
http认证原理和https bijian1013 http https
一.基础介绍在URL前加https://前缀表明是用SSL加密的。你的电脑与服务器之间收发的信息传输将更加安全。 Web服务器启用SSL需要获得一个服务器证书并将该证书与要使用SSL的服务器绑定。 http和https使用的是完全不同的连接方式，用的端口也不一样,前者是80，后
【Java范型五】范型继承 bit1129 java
定义如下一个抽象的范型类，其中定义了两个范型参数，T1，T2 package com.tom.lang.generics; public abstract class SuperGenerics<T1, T2> { private T1 t1; private T2 t2; public abstract void doIt(T
【Nginx六】nginx.conf常用指令(Directive) bit1129 Directive
1. worker_processes 8; 表示Nginx将启动8个工作者进程，通过ps -ef|grep nginx,会发现有8个Nginx Worker Process在运行 nobody 53879 118449 0 Apr22 ? 00:26:15 nginx: worker process
lua 遍历Header头部 ronin47 lua header 遍历　
local headers = ngx.req.get_headers() ngx.say("headers begin", "<br/>") ngx.say("Host : ", he
java-32.通过交换a,b中的元素，使[序列a元素的和]与[序列b元素的和]之间的差最小(两数组的差最小)。 bylijinnan java
import java.util.Arrays; public class MinSumASumB { /** * Q32.有两个序列a,b，大小都为n,序列元素的值任意整数，无序. * * 要求：通过交换a,b中的元素，使[序列a元素的和]与[序列b元素的和]之间的差最小。 * 例如: * int[] a = {100,99,98,1,2,3
redis 开窍的石头 redis
在redis的redis.conf配置文件中找到# requirepass foobared 把它替换成requirepass 12356789 后边的12356789就是你的密码打开redis客户端输入config get requirepass 返回 redis 127.0.0.1:6379> config get requirepass 1) "require
[JAVA图像与图形]现有的GPU架构支持JAVA语言吗？ comsci java语言
无论是opengl还是cuda，都是建立在C语言体系架构基础上的，在未来，图像图形处理业务快速发展，相关领域市场不断扩大的情况下，我们JAVA语言系统怎么从这么庞大，且还在不断扩大的市场上分到一块蛋糕，是值得每个JAVAER认真思考和行动的事情
安装ubuntu14.04登录后花屏了怎么办 cuiyadll ubuntu
这个情况，一般属于显卡驱动问题。可以先尝试安装显卡的官方闭源驱动。按键盘三个键：CTRL + ALT + F1 进入终端，输入用户名和密码登录终端：安装amd的显卡驱动 sudo apt-get install fglrx 安装nvidia显卡驱动 sudo ap
SSL 与数字证书的基本概念和工作原理 darrenzhu 加密 ssl 证书密钥签名
SSL 与数字证书的基本概念和工作原理 http://www.linuxde.net/2012/03/8301.html SSL握手协议的目的是或最终结果是让客户端和服务器拥有一个共同的密钥，握手协议本身是基于非对称加密机制的，之后就使用共同的密钥基于对称加密机制进行信息交换。 http://www.ibm.com/developerworks/cn/webspher
Ubuntu设置ip的步骤 dcj3sjt126com ubuntu
在单位的一台机器完全装了Ubuntu Server，但回家只能在XP上VM一个，装的时候网卡是DHCP的，用ifconfig查了一下ip是192.168.92.128,可以ping通。转载不是错： Ubuntu命令行修改网络配置方法 /etc/network/interfaces打开后里面可设置DHCP或手动设置静态ip。前面auto eth0，让网卡开机自动挂载. 1. 以D
php包管理工具推荐 dcj3sjt126com PHP Composer
http://www.phpcomposer.com/ Composer是 PHP 用来管理依赖（dependency）关系的工具。你可以在自己的项目中声明所依赖的外部工具库（libraries），Composer 会帮你安装这些依赖的库文件。中文文档入门指南下载安装包列表 Composer 中国镜像
Gson使用四（TypeAdapter） eksliang json gson Gson自定义转换器 gsonTypeAdapter
转载请出自出处：http://eksliang.iteye.com/blog/2175595 一.概述 Gson的TypeAapter可以理解成自定义序列化和返序列化二、应用场景举例例如我们通常去注册时（那些外国网站），会让我们输入firstName，lastName,但是转到我们都
JQM控件之Navbar和Tabs gundumw100 html xml css
在JQM中使用导航栏Navbar是简单的。只需要将data-role="navbar"赋给div即可： <div data-role="navbar"> <ul> <li><a href="#" class="ui-btn-active&qu
利用归并排序算法对大文件进行排序 iwindyforest java 归并排序大文件分治法 Merge sort
归并排序算法介绍，请参照Wikipeida zh.wikipedia.org/wiki/%E5%BD%92%E5%B9%B6%E6%8E%92%E5%BA%8F 基本思想：大文件分割成行数相等的两个子文件，递归（归并排序）两个子文件，直到递归到分割成的子文件低于限制行数低于限制行数的子文件直接排序两个排序好的子文件归并到父文件直到最后所有排序好的父文件归并到输入
iOS UIWebView URL拦截啸笑天 UIWebView
本文译者：candeladiao，原文：URL filtering for UIWebView on the iPhone说明：译者在做app开发时，因为页面的javascript文件比较大导致加载速度很慢，所以想把javascript文件打包在app里，当UIWebView需要加载该脚本时就从app本地读取，但UIWebView并不支持加载本地资源。最后从下文中找到了解决方法，第一次翻译，难免有
索引的碎片整理SQL语句 macroli sql
SET NOCOUNT ON DECLARE @tablename VARCHAR (128) DECLARE @execstr VARCHAR (255) DECLARE @objectid INT DECLARE @indexid INT DECLARE @frag DECIMAL DECLARE @maxfrag DECIMAL --设置最大允许的碎片数量,超过则对索引进行碎片
Angularjs同步操作http请求with $promise qiaolevip 每天进步一点点学习永无止境 AngularJS 纵观千象
// Define a factory app.factory('profilePromise', ['$q', 'AccountService', function($q, AccountService) { var deferred = $q.defer(); AccountService.getProfile().then(function(res) {
hibernate联合查询问题 sxj19881213 sql Hibernate HQL 联合查询
最近在用hibernate做项目，遇到了联合查询的问题，以及联合查询中的N+1问题。针对无外键关联的联合查询，我做了HQL和SQL的实验，希望能帮助到大家。（我使用的版本是hibernate3.3.2） 1 几个常识：（1）hql中的几种join查询，只有在外键关联、并且作了相应配置时才能使用。（2）hql的默认查询策略，在进行联合查询时，会产
struts2.xml wuai struts
<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN" "http://struts.apache

按字母分类： A B C D E F G H I J K L M N O P Q R S T U V W X Y Z 其他