CSS样式中的布局、字体、响应式布局

目录

一、使用内联块级元素布局
二、使用float布局
三、使用弹性盒子布局
四、服务器字体
五、响应式布局

相关文章

积累CSS样式属性：padding、margin、display:flex、font、position、cursor、:hover、:nth-child()、border-radius

一、使用内联块级元素布局

让想要横着的元素（left、mid、right）变成内联块级元素。

示例


  
    left
    mid
    right

.top{
  width: 800px;
  background: red;
}

.left{
  width: 200px;
  height: 100px;
  background: greenyellow;
  display:inline-block;
}

.mid{
  width: 200px;
  height: 100px;
  background: bisque;
  display:inline-block;
}

.right{
  width: 200px;
  height: 100px;
  background: blueviolet;
  display:inline-block;
}

.bottom{
  width: 800px;
  height: 100px;
  background: palevioletred;
}

效果图：

问题1： left、mid、right元素之间有空隙。
原因： html中元素之间换行，浏览器解析为一个空格。
解决方案：

方案一：元素首尾相连
方案二：改为span标签；问题：内容多或不适合使用span标签的内容
方案三：将父级（top）设置字体大小为0font-size:0;；问题：由于继承性，left、mid、right字体也消失了，需要在相对于的子集中设置有效的字体大小

问题2： 想将子集均匀的分散开，需要计算，有可能无法均分。
解决方案： 可以使用margin元素；但依然可能分散的不均匀。
问题3： 每个子集都要写一遍，代码冗余。

二、使用float布局

哪些元素想要浮动，可使用float属性

示例


  
    left
    mid
    right

.top{
  width: 800px;
  background: red;
}

.left{
  width: 200px;
  height: 100px;
  background: greenyellow;
  float: left;/* 浮动 */
}

.mid{
  width: 200px;
  height: 100px;
  float: left;
  background: bisque;
}

.right{
  width: 200px;
  height: 100px;
  float: left;
  background: blueviolet;
}

.bottom{
  width: 800px;
  height: 100px;
  background: palevioletred;
}

效果图：

解决了上面的空隙问题。
新问题： 父级元素被覆盖了。
原因： 父级元素没有设置高，原来父级元素由子集内容撑着，现在脱离了父级，父级元素高变为了0。
解决方案：

方案一：父级元素设置高。
方案二：不设置父级元素的高度，在父级上使用超出部分隐藏掉overflow:hidden，可以使父级元素随子集元素中最高的而变化。

上述的问题2和问题3没有解决。

三、使用弹性盒子布局

让父级元素变为弹性盒子。
弹性盒子会配套其他属性一起使用，这些属性没有继承性。
- 1. flex-direction
- 2. justify-content
- 3. order
- 4. flex复合属性
- 5. align-items
- 6. align-content


  
    left
    mid
    right

.top{
  width: 800px;
  background: red;
  display: flex;
}

.left{
  width: 200px;
  height: 100px;
  background: greenyellow;
}

.mid{
  width: 200px;
  height: 100px;
}

.right{
  width: 200px;
  height: 100px;
  background: blueviolet;
}

.bottom{
  width: 800px;
  height: 100px;
  background: palevioletred;
}

效果图：

上面的问题都解决了。

1. `flex-direction`

控制弹性盒子内子元素的排列方向
作用在父级元素上

属性值

row：横向（默认值），从左到右
row-reverse：反转，从右到左
column：竖着，从上到下
column-reverse：反转，从下到上

2. `justify-content`

控制弹性盒子内子元素的分布方式
作用在父级元素上

属性值

flex-start：分布在开始位置
flex-end：分布在结束位置
center：分布在中间位置
space-between：分散开，空白在元素之间
space-around：空白在元素两边
space-evenly：空白均匀的分布

3. `order`

控制子元素的排列顺序
作用在具体元素上

属性值

数字：整数

4. `flex`复合属性

是复合属性
作用在子元素上

4.1 `flex-grow`：拉伸因子

子元素占满父级
子元素均匀分占父级，拉伸因子都为1
属性值： 整数
示例：

.top{
  width: 800px;
  background: red;
  display: flex;
}

.left{
  width: 200px;
  height: 100px;
  background: greenyellow;
  flex-grow: 1;
}

.mid{
  width: 200px;
  height: 100px;
  flex-grow: 2;
  background: bisque;
}

.right{
  width: 200px;
  height: 100px;
  flex-grow: 5;
  background: blueviolet;
}

.bottom{
  width: 800px;
  height: 100px;
  background: palevioletred;
}

效果图：

4.2 `flex-shrink`：压缩因子

子元素宽超过父级元素的宽度，弹性盒子默认等比压缩
作用在子元素上
属性值： 整数

4.3 `flex-basis`：基准因子

以谁为基准做拉伸或压缩。

5. `align-items`

控制弹性盒子内子元素在垂直方向上的分布方式。
作用在父级元素上
属性值：
flex-start：顶部（左边）对齐
flex-end：底部（右边）对齐
center：中间对齐

6. `align-content`

控制弹性盒子内子元素多行的分布方式
与flex-wrap配合使用
属性值：
flex-start：开始位置
flex-end：结束位置
center：中间位置
space-between：空白在行和行之间
space-around：空白在行上下两测
space-evenly：空白均匀的分布

7. `flex-wrap:wrap`

弹性盒子内子元素换行
作用在父级元素上

四、服务器字体

字体的其他属性还可以查看积累CSS样式属性：padding、margin、display:flex、font、position、cursor、:hover、:nth-child()、border-radius这篇文章中的相关内容。

使用的字体可以放在项目里，一起打包
从网上下载下来的后缀为：ttf、otf

定义服务器字体

使用@font-face
可以定义多个

基本格式

<style>
    @font-face {
      font-family: ;
      src: url();
    }
  style>

font-family：字体的名字
注意： font-family放在选择器里面表示，使用哪种字体；放在@font-face里面表示定义字体的名字
src：字体资源的地址
format：字体资源的类型，属性值如下：
- TrueType，是ttf格式的资源
- OpenType，是otf格式的资源

示例：

DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Documenttitle>
  <style>
    div{
      font-family: 'aaa';
    }
    @font-face {
      font-family: 'aaa';
      src: url(../font/ZiHunDunHuangJingYunKai\(ShangYongXuShouQuan\)-2.ttf) format(TrueType);
    }
    @font-face {
      font-family: 'bbb';
      src: url(../font/GongFanNuFangTi\(TaoBaoSouGongFanZiKuKeMaiDanZiShouQuan\)-2.ttf);
    }
  style>
head>
<body>
  <div>你好div>
  <p>你好p>
body>
html>

效果图：

五、响应式布局

使用的式@madia 设备类型

基本格式

@media screen {
      
    }

screen：屏幕，大部分使用的都是屏幕设备
screen前可以加not：意思是除了屏幕，别的设备都去检测
screen前可以加only：意思是只检测屏幕
screen后可以加设备类型width：
- max-width：最大宽度，设备不到XXpx，走这里面的样式
- min-width：最小宽度
样式冲突的走响应式布局，不冲突的样式走外面的

示例：

box-sizing: border-box;：加上这句，width/height设置整个盒子的尺寸，不再是内容的尺寸了

<body>
  <div class="contaner">
    <div class="item1">div>
    <div class="item2">div>
    <div class="item3">div>
  div>
body>

.contaner{
  width: 750px;
  display: flex;
  flex-wrap: wrap;
  margin: 100px auto;
}
.item1{
  box-sizing: border-box;
  width: 300px;
  height: 200px;
  border: 8px solid plum;
  margin: 0px 10px 10px 0px;
}
.item2{
  box-sizing: border-box;
  width: 420px;
  height: 200px;
  border: 8px solid skyblue;
}
.item3{
  box-sizing: border-box;
  width: 700px;
  height: 200px;
  border: 8px solid peachpuff;
}
@media screen and (max-width:700px){
  /* 屏幕尺寸不到700走这套样式 */
  .contaner{
    width: 500px;
  }
  .item1{
    width: 500px;
  }
  .item2{
    width: 500px;
  }
  .item3{
    width: 500px;
  }
}

效果图：
浏览器屏幕大于700px：

浏览器屏幕下于700px：

你可能感兴趣的:(CSS样式中的布局、字体、响应式布局)

三菱PLC全套学习资料及应用手册 good2know
本文还有配套的精品资源，点击获取简介：三菱PLC作为工业自动化领域的核心设备，其系列产品的学习和应用需要全面深入的知识。本次资料包为学习者提供从基础到进阶的全方位学习资源，包括各种型号PLC的操作手册、编程指南、软件操作教程以及实际案例分析，旨在帮助用户系统掌握PLC的编程语言、指令系统及在各类工业应用中的实施。1.三菱PLC基础知识入门1.1PLC的基本概念可编程逻辑控制器（PLC）是工业自动化
力扣热题100-------54. 螺旋矩阵海航Java之路力扣 leetcode 矩阵 java
给你一个m行n列的矩阵matrix，请按照顺时针螺旋顺序，返回矩阵中的所有元素。示例1：输入：matrix=[[1,2,3],[4,5,6],[7,8,9]]输出：[1,2,3,6,9,8,7,4,5]示例2：输入：matrix=[[1,2,3,4],[5,6,7,8],[9,10,11,12]]输出：[1,2,3,4,8,12,11,10,9,5,6,7]提示：m==matrix.lengthn
C++ 计数排序、归并排序、快速排序每天搬一点点砖 c++数据结构算法
计数排序：是一种基于哈希的排序算法。他的基本思想是通过统计每个元素的出现次数，然后根据统计结果将元素依次放入排序后的序列中。这种排序算法适用于范围较小的情况，例如整数范围在0到k之间计数排序步骤：1初始化一个长度为最大元素值加1的计数数组，所有元素初始化为02遍历原始数组，将每个元素值作为索引，在计数数组中对应位置加13将数组清空4遍历计数器数组，按照数组中的元素个数放回到元数组中计数排序的优点和
重大通知！SH-TY数字体育樊纲，操盘手汪定山就是一场騙局!背后利益阴谋让人恼羞成怒法律咨询维权
原来，所谓的炒股群就是骗子组群表演，团伙以“炒股群”的名义，向不知情的人步步加套，最终目的是骗取钱财。实际上，在这个炒股群内，所谓的投资成功的“股友”、诲人不倦的“老师”、亲切友好的“客服”等，都是嫌疑人设局扮演的，目的就是拉拢想要投资挣钱的股民，骗取他们的信任，从而进一步实施诈骗。诈骗团伙会通过非法渠道获取受害人联系方式，添加为好友后，以免费推荐股票、送牛股，吸引受害人眼球，将受害人拉进“炒股群
Linux系统配置（应用程序） 1风天云月 Linux linux 应用程序编译安装 rpm http
目录前言一、应用程序概述1、命令与程序的关系2、程序的组成3、软件包封装类型二、RPM1、RPM概述2、RPM用法三、编译安装1、解包2、配置3、编译4、安装5、启用httpd服务结语前言在Linux中的应用程序被视为将软件包安装到系统中后产生的各种文档，其中包括可执行文件、配置文件、用户手册等内容，这些文档被组织为一个有机的整体，为用户提供特定的功能，因此对于“安装软件包”与“安装应用程序”这两
第28章汇编语言--- 异常处理 hummhumm 汇编算法开发语言程序设计高级语言异常处理汇编语言
在汇编语言中，异常处理是一个重要的概念，它涉及到处理器如何响应和处理程序运行时发生的非正常情况。异常可以是硬件错误（例如除零错误、非法指令）或者软件触发的中断（例如系统调用）。当发生异常时，处理器会暂停当前正在执行的程序，并转移到一个预先定义好的位置来处理这个异常。为了详细阐述第28章关于汇编语言中的异常处理，我们可以考虑一个简化的例子，展示异常处理的基本结构。请注意，实际的代码将取决于具体的处理
JVM 内存模型深度解析：原子性、可见性与有序性的实现练习时长两年半的程序员小胡 JVM 深度剖析：从面试考点到生产实践 jvm java 内存模型
在了解了JVM的基础架构和类加载机制后，我们需要进一步探索Java程序在多线程环境下的内存交互规则。JVM内存模型（JavaMemoryModel，JMM）定义了线程和主内存之间的抽象关系，它通过规范共享变量的访问方式，解决了多线程并发时的数据一致性问题。本文将从内存模型的核心目标出发，详解原子性、可见性、有序性的实现机制，以及volatile、synchronized等关键字在其中的作用。一、J
Flowable 高级扩展：自定义元素与性能优化实战练习时长两年半的程序员小胡 Flowable 流程引擎实战指南流程图 flowable BPMN 流程引擎 java
在前五篇文章中，我们从基础概念、流程设计、API实战、SpringBoot集成，到外部系统协同，逐步构建了Flowable的应用体系。但企业级复杂场景中，原生功能往往难以满足定制化需求——比如需要特殊的审批规则网关、与决策引擎联动实现动态路由，或是在高并发场景下优化流程引擎性能。本文将聚焦Flowable的高级扩展能力，详解如何自定义流程元素、集成规则引擎，并掌握大型系统中的性能调优策略。一、自定
为什么焦虑、抑郁、自残的青少年越来越多？精神健康
很多家长觉得没缺孩子吃的穿的，他们有安稳的生活，他们有什么可焦虑、抑郁的，但现在的孩子，学习压力越来越大，每天休息的时间越来越少，出现焦虑抑郁是很正常的。从发展的角度看，青少年时期，人的身体、情绪，智力、人格都急剧发展，正从未成熟走向成熟，情绪起伏不定，易冲动，再者，由于缺乏生活经验，以及来自于家长、学校、社会的各种要求和压力，从而不知所措，心中的焦虑、恐惧、彷徨得不到及时的排解，从而导致心理上的
【ARM】FPU,VFP,ASE,NEON,SVE...是什么意思？亿道电子Emdoor ARM arm开发 ARM
1、文档目标对执行浮点和SIMD操作的逻辑的各种名称的缩写词进行简要解释。2、问题场景Arm处理器内核中有用于执行浮点和SIMD操作的逻辑，有各种名称。它们通常是一系列的缩写形式，因此本文旨在对每一个缩写词进行简要解释。3、软硬件环境1、软件版本：不涉及2、电脑环境：不涉及4、相关缩写FPU(Floating-PointUnit)浮点单元浮点单元是处理器核心中的一个模块，用于使用浮点数执行算术运算
读书打卡《别想太多啦》 chenchen_68ed
第一，世间之事，不去尝试永远不知道其中的奥秘，在尝试中有失败是必然的。如果担心失败，那什么都学不会。第二，经历的失败越多，越会对失败者抱有宽容的态度，“原来如此，我也经历过类似的失败啦，那只是暂时的”。经历越多失败的长者，越能包容别人，这也就是所谓的“越年长越宽容”。成熟的人，就是在众多失败经历中不断学习，并接纳别人的失败。对于他人的小小过失不吹毛求疵，自己的心态会更加平和。在不断失败中学习，让自
图论算法经典题目解析：DFS、BFS与拓扑排序实战周童學数据结构与算法深度优先算法图论
图论算法经典题目解析：DFS、BFS与拓扑排序实战图论问题是算法面试中的高频考点，本博客将通过四道LeetCode经典题目（均来自"Top100Liked"题库），深入讲解图论的核心算法思想和实现技巧。涵盖DFS、BFS、拓扑排序和前缀树等知识点，每道题配有Java实现和易错点分析。1.岛屿数量(DFS遍历)问题描述给定一个由'1'(陆地)和'0'(水)组成的二维网格，计算岛屿的数量。岛屿由水平或
Java 队列 tryxr java 开发语言队列
队列一般用什么哪种结构实现队列的特性数据入队列时一定是从尾部插入吗数据出队列时一定是从头部删除吗队列的基本运算有什么队列支持随机访问吗队列的英文表示什么是队列队列从哪进、从哪出队列的进出顺序队列是用哪种结构实现的Queue和Deque有什么区别Queue接口的方法Queue中的add与offer的区别offer、poll、peek的模拟实现如何利用链表实现队列如何利用顺序表实现队列什么叫做双端队列
四百八十九章. 春晓客栈鲁易寒巨木擎天
邓林他们在打量别人的时候，而别人，自然也是在打量他们了。邓林就看见在这大堂里，散散啦啦的有四个人在，其中两个，只是僵直站立，眼眶中燃烧着橙色骨火的骷髅，而另外两个坐着的，才是眼眶中点燃黄色魂火的骨族人。这两个骨族人中的一个，在邓林他们刚一进来的时候，就把注意力都放在了伊莲娜娜的身上，似乎在确认着什么，当看到伊莲娜娜冲着自己点了点头以后，他有些激动的走过来几步，口中说道：“真的是伊莲娜娜公主殿下？您
STM32入门之TIM基本定时器嵌入式白话 STM32入门学习 stm32 嵌入式硬件单片机
一、定时器简介定时器是嵌入式系统中的关键外设之一，它可以用于生成精确的延时、周期性中断、PWM波形生成等功能。在STM32F1系列单片机中，定时器不仅能为系统提供精确的时钟，还支持外部事件的捕获以及信号输出。对于定时器的功能，我们可以通过一个生活中非常常见的例子来形象地描述：微波炉的定时器。想象你正在使用微波炉加热食物。在微波炉里，定时器的作用就是帮助你控制食物加热的时间。当你设置了加热时间后，定
JVM 内存分配与回收策略：从对象创建到内存释放的全流程
在JVM的运行机制中，内存分配与回收策略是连接对象生命周期与垃圾收集器的桥梁。它决定了对象在堆内存中的创建位置、存活过程中的区域迁移，以及最终被回收的时机。合理的内存分配策略能减少GC频率、降低停顿时间，是优化Java应用性能的核心环节。本文将系统解析JVM的内存分配规则、对象晋升机制，以及实战中的内存优化技巧。一、对象优先在Eden区分配：新生代的“临时缓冲区”大多数情况下，Java对象在新生代
北斗短报文兜底、5G-A增强：AORO P1100三防平板构建应急通信网络
公网中断的灾区现场，泥石流阻断了最后一条光缆。一支救援队却在废墟间有序穿行，队长手中的三防平板正闪烁着北斗卫星信号，定位坐标与伤亡信息化作一行行短报文，穿透通信孤岛直达指挥中心。这是AOROP1100三防平板搭载的北斗短报文功能在应急救援中的真实场景，更代表了工业移动终端在极端环境下的能力跃迁。AOROP1100三防平板作为遨游通讯2025年推出的旗舰三防设备，AOROP1100三防平板的技术基底
猎板 PCB 控深槽工艺：5G 基站散热模块的关键支撑猎板PCB黄浩 5G 运维数据库
PCB控深槽工艺在5G基站散热模块中的关键作用：猎板PCB的技术突破在5G基站的密集高频信号与高功率运行环境下，散热性能直接决定了设备的稳定性和寿命。猎板PCB通过创新性的控深槽工艺（控深锣/控深铣），结合材料科学与结构优化，为5G基站散热模块提供了高精度、高可靠性的解决方案，有效攻克了高热负荷下的技术瓶颈。一、5G基站散热的核心挑战热负荷激增：5G基站的射频功放（PA）、电源管理模块等器件功耗显
提升在直返APP中的等级：解锁更多特权与收益的秘诀古楼
在直返APP的世界里，每个用户都渴望提升自己的等级，以解锁更多特权与收益。那么，如何提升在直返APP中的等级呢？接下来，我们将为您揭示这一秘密。【高省】APP（高佣金领导者）是一个自用省钱佣金高，分享推广赚钱多的平台，百度有几百万篇报道，运行三年，稳定可靠。高省APP，是2021年推出的平台，0投资，0风险、高省APP佣金更高，模式更好，终端用户不流失。高省是公认的返利最高的软件。古楼导师高省邀请
D124:如何训练独立思考力？大栗子_
当我们要判断一个理论或者思想是否正确，需要有三个层次，分别是体验、解释和分析。首先看体验。很多时候，我们会相信“听上去、感觉是对的”的事情。我们之前讲的太空笔的故事之所以大多数人都认为是对的，就是有一些看似真实的关键词，比如美国，NASA，设计等，这些词看起来非常权威，但是离我们又遥远，这时候我们的大脑就会放松警惕了。于是，我们毫不犹豫就接受了。说到这里，你有没有发现之前的电视广告中的各种高让我们
孤独的守候怒吼的生命
孤独了时光岁月了寂寞带来了惆怅那些孤独的日子里我们珍惜奋斗起来品味人生的真谛做到更好奋斗当中的你是那么努力格外自律学习起来五彩斑斓那些日子时光匆匆人生的机会很多需要把握痛苦的回忆记得住那些忧愁孤苦五一的日子寂寞当中的你时光荏苒独自带给我荒草学习起来努力奋斗可是我们做的还不够把握发展生活带给我们更多希望静静的述说你的故事你的精彩人生当中我们总是努力把握生活带给我们更多的学习生活当中我们奋斗可是做的还
用好考评指挥棒答好时代新答卷天才码字选手
民之所望，施政所向。而群众评议正是检验发展质量和人民获得感的试金石。究竟是“走过场”、“栽盆景”，还是俯下身子，甘当为民服务的“孺子牛”或撸起袖子，做担当作为的“拓荒牛”，群众自是看得清清楚楚，最有发言权。因而也有这样一句话：干部脚下沾多少泥土，群众心里就有多少感情。民意不可或缺，群众的意见不能少。新时代下，要最大程度发挥群众评议在激励干部担当作为中的效能，才能汇聚起推动高质量发展的磅礴之力，答好
AI模型训练中过拟合和欠拟合的区别是什么？ workflower 人工智能算法人工智能数据分析
在AI模型训练中，过拟合和欠拟合是两种常见的模型性能问题，核心区别在于模型对数据的学习程度和泛化能力：欠拟合（Underfitting）-定义：模型未能充分学习到数据中的规律，对训练数据的拟合程度较差，在训练集和测试集上的表现都不好（如准确率低、损失值高）。-原因：-模型结构过于简单（如用线性模型解决非线性问题）；-训练数据量不足或特征信息不充分；-训练时间太短，模型尚未学到有效模式。-表现：训练
全面解读设备状态监测 xiatianxy 设备状态监测设备状态监测
长期以来，基于巡检和定期维护维修保养的方式，对电机\泵类\风机等旋转类设备的故障维修，大多都是在设备问题出现之后的事后维护或者定期的预防性维护，前者无法减少或避免设备故障的发生，后者则存在维修不足或维修过剩等问题。另外，日常维护工作严重依赖于人的责任心和经验，一旦出现人员更替，设备的运营管理压力加大，并且现场丰富的维护保养经验也很难传承到新人手中。维护利器——设备状态监测设备状态监测，即对运行中的
元宇宙中的视觉技术：虚拟化身与场景生成 xcLeigh 计算机视觉CV 元宇宙虚拟化身场景生成 AIGC 数字孪生
元宇宙中的视觉技术：虚拟化身与场景生成前言一、元宇宙与视觉技术的深度关联1.1元宇宙概念深度剖析1.2视觉技术：元宇宙的“灵魂之窗”二、虚拟化身：数字世界的“第二自我”2.1虚拟化身技术的深度解析2.1.1核心技术构成2.1.2技术实现原理与流程2.2虚拟化身的应用领域及案例展示2.2.1游戏娱乐领域2.2.2教育培训领域三、场景生成：构建元宇宙的虚拟天地3.1场景生成技术全景透视3.1.1关键技
【Coze搞钱实战】3. 避坑指南：对话流设计中的6个致命错误（真实案例） AI_DL_CODE Coze平台对话流设计客服Bot避坑用户流失封号风险智能客服配置故障修复指南
摘要：对话流设计是智能客服Bot能否落地的核心环节，直接影响用户体验与业务安全。本文基于50+企业Bot部署故障分析，聚焦导致用户流失、投诉甚至封号的6大致命错误：无限循环追问、人工移交超时、敏感词过滤缺失、知识库冲突、未处理否定意图、跨平台适配失败。通过真实案例拆解每个错误的表现形式、技术根因及工业级解决方案，提供可直接复用的Coze配置代码、工作流模板和检测工具。文中包含对话流健康度检测工具使
陶勇：要不要参加分班考试学习？看完再说。陶勇
每年到了升学季，有很多培训机构都特别忙，为什么呢？因为有成千上万的学生，会选择升学前的分班考试的培训。比如说，小升初的孩子，到了暑假，很多孩子都会去选择一个初中，初一的分班考试的培训，那考入高中的孩子也有很多孩子会选择这种新高一的分班考试的培训。当然了，我个人认为这种选择并不是孩子自身的选择，主要还是家长的选择。当然也有少数孩子会对自己有比较高的要求，他们也会主动的去选择。为什么要去上分班考试的这
C++编程基础与面向对象概念解析侯昂面向对象编程 C++语法函数类与对象继承与多态性
C++编程基础与面向对象概念解析背景简介C++是一种广泛使用的面向对象编程语言，它允许开发者创建高效、灵活且功能强大的程序。本文基于《C++Primer》一书的章节内容，深入解析C++的核心概念和面向对象编程原则，旨在帮助读者构建扎实的C++编程基础。面向对象编程的原则软件危机与进化介绍了软件危机的产生和软件进化的必要性，强调了面向对象编程（OOP）在应对这些问题中的优势。面向对象编程范式讨论了面
《感官品牌》读书笔记 1 西红柿阿达
原文:最近我在东京街头闲逛时，与一位女士擦肩而过，我发现她的香水味似曾相识。“哗”的一下，记亿和情感立刻像潮水般涌了出来。这个香水味把我带回了15年前上高中的时候，我的一位亲密好友也是用这款香水。一瞬间，我呆站在那里，东京的街景逐渐淡出，取而代之的是我年少时的丹麦以及喜悦、悲伤、恐惧、困惑的记忆。我被这熟悉的香水味征服了。感想:感官是有记忆的，你所听到，看到，闻到过的有代表性的事件都会在大脑中深深
小确幸5.23 聪聪和茵茵
图片发自App经常有好友问我，你是怎么教育孩子的？尽管我没仔细去思考这个问题，不过我还是知无不言，言无不尽的。每个孩子都是独特的，大概只有父母最为了解自己的孩子，所以其他人的做法不一定适合你的孩子，还是自己多用心去感受和体会这其中的酸甜苦辣吧。我想大概出于对孩子打出内心深处的爱，有时难免急燥粗暴地解决问题，但过后会反思，意识到自己的错误，会认真的和孩子交谈，并道歉。我是第一次当妈妈，你们是第一次当
log4j对象改变日志级别 3213213333332132 java log4j level log4j对象名称日志级别
log4j对象改变日志级别可批量的改变所有级别，或是根据条件改变日志级别。 log4j配置文件： log4j.rootLogger=ERROR,FILE,CONSOLE,EXECPTION #log4j.appender.FILE=org.apache.log4j.RollingFileAppender log4j.appender.FILE=org.apache.l
elk+redis 搭建nginx日志分析平台 ronin47 elasticsearch kibana logstash
elk+redis 搭建nginx日志分析平台 logstash,elasticsearch,kibana 怎么进行nginx的日志分析呢？首先，架构方面，nginx是有日志文件的，它的每个请求的状态等都有日志文件进行记录。其次，需要有个队列，redis的l
Yii2设置时区 dcj3sjt126com PHP timezone yii2
时区这东西，在开发的时候，你说重要吧，也还好，毕竟没它也能正常运行，你说不重要吧，那就纠结了。特别是linux系统，都TMD差上几小时，你能不痛苦吗？win还好一点。有一些常规方法，是大家目前都在采用的1、php.ini中的设置，这个就不谈了，2、程序中公用文件里设置，date_default_timezone_set一下时区3、或者。。。自己写时间处理函数，在遇到时间的时候，用这个函数处理（比较
js实现前台动态添加文本框，后台获取文本框内容 171815164 文本框
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w
持续集成工具 g21121 持续集成
持续集成是什么？我们为什么需要持续集成？持续集成带来的好处是什么？什么样的项目需要持续集成？... 持续集成(Continuous integration ,简称CI)，所谓集成可以理解为将互相依赖的工程或模块合并成一个能单独运行
数据结构哈希表(hash)总结永夜-极光数据结构
1.什么是hash 来源于百度百科: Hash，一般翻译做“散列”，也有直接音译为“哈希”的，就是把任意长度的输入，通过散列算法，变换成固定长度的输出，该输出就是散列值。这种转换是一种压缩映射，也就是，散列值的空间通常远小于输入的空间，不同的输入可能会散列成相同的输出，所以不可能从散列值来唯一的确定输入值。简单的说就是一种将任意长度的消息压缩到某一固定长度的消息摘要的函数。
乱七八糟程序员是怎么炼成的
eclipse中的jvm字节码查看插件地址： http://andrei.gmxhome.de/eclipse/ 安装该地址的outline 插件后重启，打开window下的view下的bytecode视图 http://andrei.gmxhome.de/eclipse/ jvm博客： http://yunshen0909.iteye.com/blog/2
职场人伤害了“上司” 怎样弥补 aijuans 职场
由于工作中的失误，或者平时不注意自己的言行“伤害”、“得罪”了自己的上司，怎么办呢？　　在职业生涯中这种问题尽量不要发生。下面提供了一些解决问题的建议：　　一、利用一些轻松的场合表示对他的尊重　　即使是开明的上司也很注重自己的权威，都希望得到下属的尊重，所以当你与上司冲突后，最好让不愉快成为过去，你不妨在一些轻松的场合，比如会餐、联谊活动等，向上司问个好，敬下酒，表示你对对方的尊重，
深入浅出url编码 antonyup_2006 应用服务器浏览器 servlet weblogic IE
出处：http://blog.csdn.net/yzhz 杨争 http://blog.csdn.net/yzhz/archive/2007/07/03/1676796.aspx 一、问题：编码问题是JAVA初学者在web开发过程中经常会遇到问题，网上也有大量相关的
建表后创建表的约束关系和增加表的字段百合不是茶标的约束关系增加表的字段
下面所有的操作都是在表建立后操作的,主要目的就是熟悉sql的约束,约束语句的万能公式 1,增加字段(student表中增加姓名字段) alter table 增加字段的表名 add 增加的字段名增加字段的数据类型 alter table student add name varchar2(10); &nb
Uploadify 3.2 参数属性、事件、方法函数详解 bijian1013 JavaScript uploadify
一.属性属性名称默认值说明 auto true 设置为true当选择文件后就直接上传了，为false需要点击上传按钮才上传。 buttonClass ” 按钮样式 buttonCursor ‘hand’ 鼠标指针悬停在按钮上的样子 buttonImage null 浏览按钮的图片的路
精通Oracle10编程SQL(16)使用LOB对象 bijian1013 oracle 数据库 plsql
/* *使用LOB对象 */ --LOB(Large Object)是专门用于处理大对象的一种数据类型，其所存放的数据长度可以达到4G字节 --CLOB/NCLOB用于存储大批量字符数据，BLOB用于存储大批量二进制数据，而BFILE则存储着指向OS文件的指针 /* *综合实例 */ --建立表空间 --#指定区尺寸为128k,如不指定，区尺寸默认为64k CR
【Resin一】Resin服务器部署web应用 bit1129 resin
工作中，在Resin服务器上部署web应用，通常有如下三种方式：配置多个web-app 配置多个http id 为每个应用配置一个propeties、xml以及sh脚本文件配置多个web-app 在resin.xml中,可以为一个host配置多个web-app <cluster id="app&q
red5简介及基础知识白糖_ 基础
简介 Red5的主要功能和Macromedia公司的FMS类似，提供基于Flash的流媒体服务的一款基于Java的开源流媒体服务器。它由Java语言编写，使用RTMP作为流媒体传输协议，这与FMS完全兼容。它具有流化FLV、MP3文件，实时录制客户端流为FLV文件，共享对象，实时视频播放、Remoting等功能。用Red5替换FMS后,客户端不用更改可正
angular.fromJson boyitech AngularJS AngularJS 官方API AngularJS API
angular.fromJson 描述: 把Json字符串转为对象使用方法: angular.fromJson(json); 参数详解: Param Type Details json string JSON 字符串返回值: 对象, 数组, 字符串或者是一个数字示例: <!DOCTYPE HTML> <h
java-颠倒一个句子中的词的顺序。比如： I am a student颠倒后变成：student a am I bylijinnan java
public class ReverseWords { /** * 题目：颠倒一个句子中的词的顺序。比如： I am a student颠倒后变成：student a am I.词以空格分隔。 * 要求： * 1.实现速度最快,移动最少 * 2.不能使用String的方法如split,indexOf等等。 * 解答：两次翻转。 */ publ
web实时通讯 Chen.H Web 浏览器 socket 脚本
关于web实时通讯，做一些监控软件。由web服务器组件从消息服务器订阅实时数据，并建立消息服务器到所述web服务器之间的连接，web浏览器利用从所述web服务器下载到web页面的客户端代理与web服务器组件之间的socket连接，建立web浏览器与web服务器之间的持久连接；利用所述客户端代理与web浏览器页面之间的信息交互实现页面本地更新，建立一条从消息服务器到web浏览器页面之间的消息通路
[基因与生物]远古生物的基因可以嫁接到现代生物基因组中吗? comsci 生物
大家仅仅把我说的事情当作一个IT行业的笑话来听吧..没有其它更多的意思如果我们把大自然看成是一位伟大的程序员,专门为地球上的生态系统编制基因代码,并创造出各种不同的生物来,那么6500万年前的程序员开发的代码,是否兼容现代派的程序员的代码和架构呢?
oracle 外部表 daizj oracle 外部表 external tables
oracle外部表是只允许只读访问，不能进行DML操作，不能创建索引，可以对外部表进行的查询，连接，排序，创建视图和创建同义词操作。 you can select, join, or sort external table data. You can also create views and synonyms for external tables. Ho
aop相关的概念及配置 daysinsun AOP
切面(Aspect): 通常在目标方法执行前后需要执行的方法（如事务、日志、权限），这些方法我们封装到一个类里面，这个类就叫切面。连接点（joinpoint） spring里面的连接点指需要切入的方法，通常这个joinpoint可以作为一个参数传入到切面的方法里面（非常有用的一个东西）。通知（Advice）通知就是切面里面方法的具体实现，分为前置、后置、最终、异常环
初一上学期难记忆单词背诵第二课 dcj3sjt126com english word
middle 中间的，中级的 well 喔，那么；好吧 phone 电话，电话机 policeman 警察 ask 问 take 拿到；带到 address 地址 glad 高兴的，乐意的 why 为什么 China 中国 family 家庭 grandmother (外)祖母 grandfather (外)祖父 wife 妻子 husband 丈夫 da
Linux日志分析常用命令 dcj3sjt126com linux log
1.查看文件内容 cat -n 显示行号 2.分页显示 more Enter 显示下一行空格显示下一页 F 显示下一屏 B 显示上一屏 less /get 查询"get"字符串并高亮显示 3.显示文件尾 tail -f 不退出持续显示 -n 显示文件最后n行 4.显示头文件 head -n 显示文件开始n行 5.内容排序 sort -n 按照
JSONP 原理分析 fantasy2005 JavaScript jsonp jsonp 跨域
转自 http://www.nowamagic.net/librarys/veda/detail/224 JavaScript是一种在Web开发中经常使用的前端动态脚本技术。在JavaScript中，有一个很重要的安全性限制，被称为“Same-Origin Policy”（同源策略）。这一策略对于JavaScript代码能够访问的页面内容做了很重要的限制，即JavaScript只能访问与包含它的
使用connect by进行级联查询 234390216 oracle 查询父子 Connect by 级联
使用connect by进行级联查询 connect by可以用于级联查询，常用于对具有树状结构的记录查询某一节点的所有子孙节点或所有祖辈节点。来看一个示例，现假设我们拥有一个菜单表t_menu，其中只有三个字段：
一个不错的能将HTML表格导出为excel,pdf等的jquery插件 jackyrong jquery插件
发现一个老外写的不错的jquery插件，可以实现将HTML 表格导出为excel,pdf等格式，地址在： https://github.com/kayalshri/ 下面看个例子，实现导出表格到excel,pdf <html> <head> <title>Export html table to excel an
UI设计中我们为什么需要设计动效 lampcy UI UI设计
关于Unity3D中的Shader的知识首先先解释下Unity3D的Shader，Unity里面的Shaders是使用一种叫ShaderLab的语言编写的，它同微软的FX文件或者NVIDIA的CgFX有些类似。传统意义上的vertex shader和pixel shader还是使用标准的Cg/HLSL 编程语言编写的。因此Unity文档里面的Shader，都是指用ShaderLab编写的代码，
如何禁止页面缓存 nannan408 html jsp cache
禁止页面使用缓存~ ------------------------------------------------ jsp:页面no cache： response.setHeader("Pragma","No-cache"); response.setHeader("Cache-Control","no-cach
以代码的方式管理quartz定时任务的暂停、重启、删除、添加等 Everyday都不同定时任务管理 spring-quartz
【前言】在项目的管理功能中，对定时任务的管理有时会很常见。因为我们不能指望只在配置文件中配置好定时任务就行了，因为如果要控制定时任务的 “暂停” 呢？暂停之后又要在某个时间点 “重启” 该定时任务呢？或者说直接 “删除” 该定时任务呢？要改变某定时任务的触发时间呢？ “添加” 一个定时任务对于系统的使用者而言，是不太现实的，因为一个定时任务的处理逻辑他是不
EXT实例 tntxia ext
（1）增加一个按钮 JSP: <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); Stri
数学学习在计算机研究领域的作用和重要性 xjnine Math
最近一直有师弟师妹和朋友问我数学和研究的关系，研一要去学什么数学课。毕竟在清华，衡量一个研究生最重要的指标之一就是paper,而没有数学，是肯定上不了世界顶级的期刊和会议的，这在计算机学界尤其重要！你会发现，不论哪个领域有价值的东西，都一定离不开数学！在这样一个信息时代，当google已经让世界没有秘密的时候，一种卓越的数学思维，绝对可以成为你的核心竞争力. 无奈本人实在见地

按字母分类： 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 其他