爱吃西瓜的小颜
爱吃西瓜的小颜

原生Html，Css的重要知识点

学了快一年事件的前端了，目前在主攻vue，很长一段时间构建前端页面都是依靠elenet-ui，bootstarp之类的，最近想来用纯HTML，css(静态网站)来写页面布局（今后肯定会有高度定值化的网站布局了），发现之前学过的东西有很多知识都变得非常的不熟练，还有很多的细节之前的学习过程被忽视了，这一篇博客主要是来记录复习的知识点

目录

    • 首先来讲一下行内元素和块级元素
    • 来讲讲css定位position
      • static
      • relative（重点）
      • absolute（重点）
      • fixed
      • sticky
    • 伪类选择器
      • :hover（重点）

首先来讲一下行内元素和块级元素

行内元素

  1. 与兄弟元素都是在一行里边
  2. 不占有独立的区域，仅仅依靠自己的字体大小或者图像大小来支撑结构
  3. 一般是不可以设置宽度，高度以及对其等属性。（这一点是非常值得注意的）
  4. 水平方向的margin和padding是可以设置的

块级元素’
5. 每个块级元素都会自己独自占据一行
6. 高度，行高，内外边距都是可以单独设置的
7. 默认的宽度为容器的100%

行内块元素
简单来说就是讲行内元素和块级元素两者的特点进行了结合

display: block;   将元素定义为块级元素
display: inline;  将元素定义为行内元素
display: inline-block； 将元素定义为行内块元素

来讲讲css定位position

对于position有五种应用与元素定位的方法类型，分别是：

  1. static
  2. relative
  3. absolute
  4. fixed
  5. sticky
    元素位置的操作其实都是通过top，bottom，left，right属性进行定位的，但是必须得设置position属性，才可以使用之前的top等属性，不同的position属性的值对应不同的定位方式

static

  • HTML 元素默认情况下的定位方式为 static（静态）。
  • 静态定位的元素不受 top、bottom、left 和 right 属性的影响。
  • position: static; 的元素不会以任何特殊方式定位；它始终根据页面的正常流进行定位：
    简而言之就是该怎样就是怎么样的，因为默认形式就是这个

relative（重点）

  • position: relative; 的元素相对于其正常位置进行定位。
  • 设置相对定位的元素的 top、right、bottom 和 left 属性将导致其偏离其正常位置进行调整。
  • 这个地方是相对自己本身的位置进行偏移，而且原先位置同样没有消失

原生Html，Css的重要知识点_第1张图片

<style>
        div {
            height: 100px;
        }
        .name1{
            background: red;
        }
        .name2{
            position: relative;
            top: 10px;
            left: 20px;
            background: blue;
        }
        .name3{
            background: #e4b653;
        }
    style>
head>
<body>
<div class="name1">div>
<div class="name2">div>
<div class="name3">div>
body>

absolute（重点）

  • position: absolute; 的元素相对于最近的定位祖先元素进行定位（而不是相对于视口定位，如 fixed）。
  • 然而，如果绝对定位的元素没有祖先，它将使用文档主体（body），并随页面滚动一起移动。
  • 注释: "被定位的"元素是其位置除 static 以外的任何元素。
  • 还有一点值得注意（与relative不同的地方），元素移动之后之前的位置不会空在那。

原生Html，Css的重要知识点_第2张图片
这个是未改变之前的样式

<style>
        .header{
            display: inline-block;
            /*position: relative;*/
        }
        .name1,.name2,.name3 {
            display: inline-block;
            width: 100px;
            height: 100px;
        }
        .name1{
            background: red;
        }
        .name2{
            /*position: absolute;*/
            /*top: 10px;*/
            /*left: 20px;*/
            background: blue;
        }
        .name3{
            background: #e4b653;
        }
    style>
head>
<body>
<div class="header">
    <p>acxgdxyp>
    <div class="name1">div>
    <div class="name2">div>
    <div class="name3">div>
div>
body>

原生Html，Css的重要知识点_第3张图片
这个是改变之后的样式

<style>
        .header{
            display: inline-block;
            position: relative;
        }
        .name1,.name2,.name3 {
            display: inline-block;
            width: 100px;
            height: 100px;
        }
        .name1{
            background: red;
        }
        .name2{
            position: absolute;
            top: 10px;
            left: 20px;
            background: blue;
        }
        .name3{
            background: #e4b653;
        }
    style>
head>
<body>
<div class="header">
    <p>acxgdxyp>
    <div class="name1">div>
    <div class="name2">div>
    <div class="name3">div>
div>
body>
//把注释去掉了而已

fixed

  • position: fixed; 的元素是相对于视口定位的，这意味着即使滚动页面，它也始终位于同一位置。 top、right、bottom 和 left 属性用于定位此元素。
  • 固定定位的元素不会在页面中通常应放置的位置上留出空隙。

总结来说就是这个定位属性是相对与视图窗口定位的，并且会随着页面的滚动而滚动，大家不妨看一下王者荣耀官网，右侧那个飘动的小妲己就是这个功能实现的（本来想插个图片的，结果说妲己图片违规）

sticky

  • position: sticky; 的元素根据用户的滚动位置进行定位。
  • 粘性元素根据滚动位置在相对（relative）和固定（fixed）之间切换。起先它会被相对定位，直到在视口中遇到给定的偏移位置为止 - 然后将其"粘贴"在适当的位置（比如 position:fixed）。

简单的来说就是，在页面滚动的时候，只要接触到页面的边界，定位属性就会从relative变成fixed

举例：
原生Html，Css的重要知识点_第4张图片
开始的时候没有接触到顶部（即距顶部的距离>20px），所以表现的为relative，当我们进行页面滚动的时候（到顶部的距离为20px）
原生Html，Css的重要知识点_第5张图片


可见不管你后边怎么移动都不相对视图窗口的位置都不会变了

这里的距离边框的位置是可以自己定义的，我在这里是距离top 20px

<style>
        .header{
            display: inline-block;
            margin-top: 20px;
        }
        p{
            position: sticky;
            top: 20px;
            background: aqua;
        }
        .name1,.name2,.name3 {
            display: inline-block;
            width: 100px;
            height: 2000px;
        }
        .name1{
            background: red;
        }
        .name2{
            background: blue;
        }
        .name3{
            background: #e4b653;
        }
    style>
head>
<body>
<div class="header">
    <p>acxgdxyp>
    <div class="name1">div>
    <div class="name2">div>
    <div class="name3">div>
div>
body>

伪类选择器

这里我不会讲所有的伪类选择器进行讲解，我只讲经常使用的

  1. 锚伪类
  2. ：hover
  3. :first-child:伪类与指定的元素匹配：该元素是另一个元素的第一个子元素
  4. :lang 伪类允许您为不同的语言定义特殊的规则。(这个我感觉我目前用的非常的少)

:hover（重点）

:hover，伪类选择器其主要的功能实现就是鼠标悬浮在某一个元素上，从而引起一些元素的变化。注意：:hover只能操作它本身或者它下面的子元素，其他任何元素无法操控。所以hover后面只能接其子元素。（这点虽然很少，但是真的很重要，之前帮同学该代码的时候就是这个地方没办法实现相应的样式）

之后的内容会继续更新

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

  • Svelte 最新中文文档教程（22）—— 自定义元素
    前言Svelte，一个语法简洁、入门容易，面向未来的前端框架。从Svelte诞生之初，就备受开发者的喜爱，根据统计，从2019年到2024年，连续6年一直是开发者最感兴趣的前端框架No.1：Svelte以其独特的编译时优化机制著称，具有轻量级、高性能、易上手等特性，非常适合构建轻量级Web项目。为了帮助大家学习Svelte，我同时搭建了Svelte最新的中文文档站点。如果需要进阶学习，也可以入手我
  • apache-maven-3.2.1安装和环境配置 ice_iceice 工具mavenapache开发工具java
    华恩IT2014/3/161.下载安装maven你可以去http://maven.apache.org/download.html下载最新的maven，目前最新版本是maven-3.2.1选择链接下载压缩包并解压，我解压路径是D:\cloud_cms\maven\apache-maven-3.2.12.环境变量的配置(1)新建系统变量名M2_HOME,变量值是D:\cloud_cms\maven\
  • 前端工程化Vue使用Node.js永久设置国内高速npm镜像源 会撸代码的懒羊羊 Nginx前端node.jsvue.js数据库npm
    前端工程化Vue使用Node.js永久设置国内高速npm镜像源接续上篇错误收录，此篇通过简单配置永久设置国内高速npm镜像源方法1.更换新版镜像清空npm缓存npmcacheclean--force修改回原版镜像源或直接删除配置过的镜像源npmconfigsetregistryhttps://registry.npmjs.org/--删除镜像源npmconfigdeleteregistry更改新版
  • 飘还是不飘？“`“引发的惨案。 dushky java前端开发语言
    Failedtoconvertvalueoftype'java.lang.String'torequiredtype'int';Forinputstring:"${page}"当您的后端服务报这个错误时？发生什么？乍一看，什么都没问题。后端服务正常启动，用swagger（Knife4j）测试好着呢。前端也没什么问题，该传的，都传了呀？特别是眼神不太好的，还看不出来'和`的区别。:-)注意前端传参的
  • ‌XPath vs CSS Selector 深度对比 test猿 css前端
    ‌核心差异总览‌‌对比维度‌‌XPath‌‌CSSSelector‌‌语法复杂度‌较高（需路径表达式）简洁（类似前端开发习惯）‌性能‌较慢（全局遍历）更快（浏览器原生优化）‌文本匹配‌✅支持（contains(text(),'abc')）❌不支持‌轴定位‌✅支持（父级、兄弟等）❌仅支持直接层级（>、+等）‌动态属性处理‌✅灵活（starts-with()等函数）✅有限（^=、$=等部分匹配）‌伪类
  • springboot项目统一接口超时机制设计 gooluke springboot后端java
    springboot项目统一接口超时机制以及异常捕获设计因为不同的业务接口所需超时时间不同，例如上传或者下载，但是大多数接口都基本可以统一一个超时时间，同时捕获异常，方便上下游子系统设置超时时间能够包住，以及业务可以根据错误码更好地判断做对应的补偿措施，前端展示失败原因主要设计：编写BaseController，提供请求统一入口，线程池提交请求并设置超时时间，超时时间可以自定义，定义一个函数式接口
  • 京东商品详情API性能优化：缓存分层与热点数据预加载策略 专注API从业者 电商平台经验分享API接口性能优化缓存大数据后端
    在京东商品详情API的使用过程中，性能优化至关重要。缓存分层与热点数据预加载策略是两种有效的优化手段，下面详细介绍：缓存分层策略1.分层结构设计浏览器缓存原理：这是最接近用户的一层缓存。当用户首次访问商品详情页时，浏览器会将页面的静态资源（如CSS、JavaScript文件、图片等）以及部分不经常变化的数据（如商品的基本描述等）进行缓存。下次用户再次访问相同页面时，浏览器会首先检查本地缓存，如果缓
  • 前端学习Day4 CSS基础笔记 Yukukiii 前端css学习
    目标能够说出什么是CSS能够使用CSS基础选择器能够设置字体样式能够设置文本样式能够说出CSS的三种引入方式能够使用Chrome调试工具调试样式CSS:层叠样式表(Cascadingstylesheets)语法：写在head里面p{color:brown;//文字变色font-size:30px;//字变大background-color:blue;//背景色为蓝色width:400px;heig
  • 《从零到全栈：JavaScript入门指南（二）》 CodeComposer javascript前端学习
    DOM操作1、DOM基础概念定义：文档对象模型（DocumentObjectModel），将HTML/XML文档解析为树形结构，提供操作页面元素的接口。核心作用：通过JavaScript动态操作网页内容（增删改查元素、样式、属性、事件等）。节点类型：元素节点（如）文本节点（如标签内的文字）属性节点（如class="box"）2、document对象入口对象：代表整个文档，提供访问和操作页面的属性和
  • 《从零到全栈：Bootstrap 响应式布局指南》 CodeComposer bootstrap前端html
    一、概念1.Bootstrap是什么？Bootstrap是一个基于HTML、CSS和JavaScript的开源前端框架，主要用于快速构建响应式网页。它是UI库（CSS库），提供了丰富的预定义样式和组件，帮助开发者快速实现美观且功能强大的界面。文档地址：Bootstrap中文文档2.响应式布局响应式布局是一种网页设计方法，使页面能够根据设备屏幕尺寸自动调整布局和样式。核心原理：通过媒体查询（@med
  • 《从零到全栈：HTML5新增元素 & API》 CodeComposer html5前端htmljavascript
    HTML5是HTML4的升级版本，它不仅简化了HTML4的冗余代码，还引入了许多新特性，使得网页开发更加高效和灵活。本文将详细介绍HTML5的概念、新增元素、API以及一些实际应用案例。一、HTML5概念HTML5是HTML的第五个版本，它简化了文档类型声明，并引入了许多新特性，使得网页开发更加高效。以下是一个简单的HTML5文档结构：HTML5示例头部导航主体侧栏主体文章尾部语义化布局的优势文档
  • Vite 与 Webpack：性能差异解析 阿珊和她的猫 webpack前端node.js
    前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》文章目录Vite与Webpack：性能差异解析开发模式下的性能ViteWebpack生产模式下的性能V
  • HTML当前标签鼠标停留下划线和变色效果 smx6666668 前端HTMLhtmlcssjavascript
    CSS#testlia:hover{border-bottom:1pxsolid#6bc30d;/*background-color:#6bc30d;背景变色*/color:#6bc30d;}HTML其他：
  • 2025年CTF夺旗赛-从零基础入门到竞赛，看这一篇就稳了！ 白帽安全-黑客4148 网络安全web安全linux密码学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天）4.3、后期五、CTF学习资源5.1、CTF赛题复现平台5.
  • 第二章：基础概念精讲 - 第二节 - Tailwind CSS 颜色系统和主题定制 tailwind-css
    颜色系统基础1.默认调色板TailwindCSS提供了一套精心设计的默认颜色系统：//tailwind.config.js默认颜色示例module.exports={theme:{colors:{//灰度gray:{50:'#f9fafb',100:'#f3f4f6',200:'#e5e7eb',//...更多色阶900:'#111827',},//主题色blue:{50:'#eff6ff',10
  • 大模型成本优化实战：从分布式训练到量化剪枝，轻松降低AI计算开销 网罗开发 AI大模型人工智能机器学习深度学习
    网罗开发（小红书、快手、视频号同名）  大家好，我是展菲，目前在上市企业从事人工智能项目研发管理工作，平时热衷于分享各种编程领域的软硬技能知识以及前沿技术，包括iOS、前端、HarmonyOS、Java、Python等方向。在移动端开发、鸿蒙开发、物联网、嵌入式、云原生、开源等领域有深厚造诣。图书作者：《ESP32-C3物联网工程开发实战》图书作者：《SwiftUI入门，进阶与实战》超级个体：CO
  • 高并发微服务日志管理：ELK、Loki、Fluentd 终极对决与实战指南 网罗开发 java集后端云原生微服务elk架构
    网罗开发（小红书、快手、视频号同名）  大家好，我是展菲，目前在上市企业从事人工智能项目研发管理工作，平时热衷于分享各种编程领域的软硬技能知识以及前沿技术，包括iOS、前端、HarmonyOS、Java、Python等方向。在移动端开发、鸿蒙开发、物联网、嵌入式、云原生、开源等领域有深厚造诣。图书作者：《ESP32-C3物联网工程开发实战》图书作者：《SwiftUI入门，进阶与实战》超级个体：CO
  • python基础之零基础入门【参数说明+代码实战】 步入烟尘 Python超入门指南全册python开发语言高级语言Python入门
    本文已收录于《Python超入门指南全册》本专栏专门针对零基础和需要进阶提升的同学所准备的一套完整教学，从基础到精通不断进阶深入，后续还有实战项目，轻松应对面试，专栏订阅地址：https://blog.csdn.net/mrdeam/category_12647587.html优点：订阅限时19.9付费专栏，私信博主还可进入全栈VIP答疑群，作者优先解答机会（代码指导、远程服务），群里大佬众多可以
  • 第二章：基础概念精讲 - 第一节 - Tailwind CSS 响应式设计系统 tailwind-css
    响应式设计基础1.断点系统TailwindCSS默认提供五个断点：//tailwind.config.js默认断点配置module.exports={theme:{screens:{'sm':'640px',//小屏幕，如手机横屏'md':'768px',//中等屏幕，如平板'lg':'1024px',//大屏幕，如笔记本'xl':'1280px',//超大屏幕，如桌面显示器'2xl':'1536
  • STM32-HAL库（下4-智能小车项目） Aspiring Q stm32单片机
    STM32-HAL库（下4-智能小车项目）269智能小车项目概述（1）小车项目综合了stm32各个知识点，具有代表性；270智能小车车身基础安装（1）小车组装后下载代码验证确保硬件无误;271车身基础安装完整版272电机驱动模块L9110S（1）参考文档链接：https://www.lxlinux.net/e/stm32/l9110s-tutorial.html（2）电机驱动模块：是一种用于控制和
  • 爬虫必备html和css基础知识 ylfhpy 爬虫项目入门爬虫htmlcsspython
    一、引言在当今数字化时代，网络上蕴含着海量的有价值数据。Python爬虫技术凭借其高效、灵活的特点，成为了获取这些数据的重要手段。而网页数据通常以HTML格式呈现，要想准确地从网页中提取所需信息，就需要深入了解HTML标签的结构和含义，以及如何运用CSS选择器精准定位目标元素。本文将围绕这两方面展开详细阐述，旨在帮助掌握Python爬虫的关键基础技能。二、常用HTML标签详解2.1文本结构标签2.
  • SpringBoot中实现简单策略模式 一只嘻嘻嘻 java策略模式springboot
    策略模式（StrategyPattern）:一个类的行为或其算法可以在运行时更改,策略模式属于行为型模式。策略模式简单Java实现:https://www.runoob.com/design-pattern/strategy-pattern.html策略模式本质就是利用类型的多态,通过接口不同实现类来实现不同的功能SpringBoot实现场景:假设登录系统的用户有多种,例如:终身会员、年度会员、月
  • 利用Python发短信 尘盖天 科普
    #首先注册互亿无线，然后复制发短信界面右上角的apiid和apikey更换代码中的account和password#APIID：1#APIKEY：a9#接口类型：互亿无线触发短信接口，支持发送验证码短信、订单通知短信等。#账户注册：请通过该地址开通账户http://sms.ihuyi.com/register.html#注意事项：#（1）调试期间，请用默认的模板进行测试，默认模板详见接口文档；#（
  • 【前端】【面试】【功能函数】写一个JavaScript树形结构操作函数：`filter` 与 `forEach` 患得患失949 面试考题专栏（前后端）前端组件前端javascript开发语言树结构filterforEach面试
    写一个JavaScript树形结构操作函数：filter与forEach在JavaScript开发中，处理树形结构数据是一项常见的任务。本文将详细介绍两个用于操作树形结构数据的函数：filter和forEach，包括它们的功能、使用方法以及具体示例。1.filter函数1.1功能概述filter函数用于过滤树形结构数据。它会遍历树形结构中的每个节点，根据传入的过滤函数func来决定是否保留该节点。
  • Python使用阿里云发送短信的两种方式 菲宇 python项目实战python
    参考文档https://help.aliyun.com/document_detail/215764.html安装依赖包pipinstallalibabacloud_tea_openapipipinstallalibabacloud_dysmsapi20170525==2.0.9第一种方式fromaliyunsdkcore.clientimportAcsClientfromaliyunsdkcor
  • js：根据后端返回的数组取出每一个数组的keyword字段然后拼接成一个逗号分隔的字符串 fury_123 elementuivue3jsjavascript开发语言ecmascript
    问：现在有一个el-select，后端接口返回数据为keyword:'xxx',referenceNum:1,tagId:'132sf32fasdfaf'组成的数组，现在select是多选，但是但我选择多个下拉框选项后，后端需要前端返回的数据tagIds字段需要时一个字符串，比方：'132sf32fasdfaf,132sf32fasdfaf,132sf32fasdfaf'这样的字符串，中间逗号要是
  • Uniapp 小程序获取用户手机号功能实现 前端小雪的博客. uni-app小程序
    在开发Uniapp小程序时，获取用户手机号是一个常见的需求，比如用于用户注册、身份验证等场景。下面将详细介绍如何在Uniapp小程序中实现获取用户手机号的功能。前端代码实现1.uniapp自带按钮在页面中添加一个按钮，当用户点击该按钮时，会触发获取手机号的操作。这里使用v-if指令判断当前平台是否为微信小程序，只有在微信小程序环境下才显示该按钮。去绑定2.处理获取手机号事件在script部分，实现
  • element-ui中树状图el-tree的使用（vue2） 前端小雪的博客. javascript前端vue.js
    热乎的，话不多说上代码html部分：//data:展示的数据//accordion:是否每次只打开一个同级树节点展开//props:配置选项默认值//expand-on-click-node:默认为true，值为false时点击小箭头才会展开收缩节点//filter-node-method:返回true节点可以显示,false节点会被隐藏//node-key:每个树节点的唯一标识//default
  • html css上下对其,html – CSS中SVG的垂直对齐 dongyuwu htmlcss上下对其
    jsfiddle1–您可以在容器上使用position：relative,并在对象上使用absolute：absolute,如下所示：position:absolute;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);left:0;right:0
  • 关于uniapp和H5的通信交互传参问题 水水水水水水水水水水水 uni-app交互
    在h5index.html中引入1.在uniapp中创建webview通信的vue页面2.h5通信webview中绑定@messageuvue中绑定@onmessage3.h5组件中获取从uniapp传过来的参数（生命周期中获取）constqueryString=window.location.search;//使用URLSearchParams对象解析查询字符串consturlParams=ne
  • JAVA基础 灵静志远 位运算加载Date字符串池覆盖
    一、类的初始化顺序 1 （静态变量，静态代码块）-->（变量，初始化块）--> 构造器 同一括号里的，根据它们在程序中的顺序来决定。上面所述是同一类中。如果是继承的情况，那就在父类到子类交替初始化。 二、String 1 String a = "abc"; JAVA虚拟机首先在字符串池中查找是否已经存在了值为"abc"的对象，根
  • keepalived实现redis主从高可用 bylijinnan redis
    方案说明 两台机器（称为A和B），以统一的VIP对外提供服务 1.正常情况下，A和B都启动，B会把A的数据同步过来（B is slave of A） 2.当A挂了后，VIP漂移到B；B的keepalived 通知redis 执行：slaveof no one，由B提供服务 3.当A起来后，VIP不切换，仍在B上面；而A的keepalived 通知redis 执行slaveof B，开始
  • java文件操作大全 0624chenhong java
    最近在博客园看到一篇比较全面的文件操作文章，转过来留着。 http://www.cnblogs.com/zhuocheng/archive/2011/12/12/2285290.html 转自http://blog.sina.com.cn/s/blog_4a9f789a0100ik3p.html 一.获得控制台用户输入的信息    &nbs
  • android学习任务 不懂事的小屁孩 工作
    任务 完成情况 搞清楚带箭头的pupupwindows和不带的使用 已完成 熟练使用pupupwindows和alertdialog，并搞清楚两者的区别 已完成 熟练使用android的线程handler,并敲示例代码 进行中 了解游戏2048的流程，并完成其代码工作 进行中-差几个actionbar 研究一下android的动画效果，写一个实例 已完成 复习fragem
  • zoom.js 换个号韩国红果果 oom
    它的基于bootstrap 的 https://raw.github.com/twbs/bootstrap/master/js/transition.js  transition.js模块引用顺序 <link rel="stylesheet" href="style/zoom.css"> <script src=&q
  • 详解Oracle云操作系统Solaris 11.2 蓝儿唯美 Solaris
    当Oracle发布Solaris 11时，它将自己的操作系统称为第一个面向云的操作系统。Oracle在发布Solaris 11.2时继续它以云为中心的基调。但是，这些说法没有告诉我们为什么Solaris是配得上云的。幸好，我们不需要等太久。Solaris11.2有4个重要的技术可以在一个有效的云实现中发挥重要作用：OpenStack、内核域、统一存档（UA）和弹性虚拟交换（EVS）。 
  • spring学习——springmvc（一） a-john springMVC
    Spring MVC基于模型-视图-控制器（Model-View-Controller，MVC）实现，能够帮助我们构建像Spring框架那样灵活和松耦合的Web应用程序。   1，跟踪Spring MVC的请求 请求的第一站是Spring的DispatcherServlet。与大多数基于Java的Web框架一样，Spring MVC所有的请求都会通过一个前端控制器Servlet。前
  • hdu4342 History repeat itself-------多校联合五 aijuans 数论
    水题就不多说什么了。 #include<iostream>#include<cstdlib>#include<stdio.h>#define ll __int64using namespace std;int main(){ int t; ll n; scanf("%d",&t); while(t--)
  • EJB和javabean的区别 asia007 beanejb
    EJB不是一般的JavaBean,EJB是企业级JavaBean,EJB一共分为3种,实体Bean,消息Bean,会话Bean,书写EJB是需要遵循一定的规范的,具体规范你可以参考相关的资料.另外,要运行EJB,你需要相应的EJB容器,比如Weblogic,Jboss等,而JavaBean不需要,只需要安装Tomcat就可以了   1.EJB用于服务端应用开发, 而JavaBeans
  • Struts的action和Result总结 百合不是茶 strutsAction配置Result配置
        一:Action的配置详解:      下面是一个Struts中一个空的Struts.xml的配置文件     <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE struts PUBLIC &quo
  • 如何带好自已的团队 bijian1013 项目管理团队管理团队
    在网上看到博客" 怎么才能让团队成员好好干活"的评论，觉得写的比较好。 原文如下： 我做团队管理有几年了吧，我和你分享一下我认为带好团队的几点： 1.诚信         对团队内成员，无论是技术研究、交流、问题探讨，要尽可能的保持一种诚信的态度，用心去做好，你的团队会感觉得到。 2.努力提
  • Java代码混淆工具 sunjing ProGuard
    Open Source Obfuscators ProGuard http://java-source.net/open-source/obfuscators/proguardProGuard is a free Java class file shrinker and obfuscator. It can detect and remove unused classes, fields, m
  • 【Redis三】基于Redis sentinel的自动failover主从复制 bit1129 redis
    在第二篇中使用2.8.17搭建了主从复制，但是它存在Master单点问题，为了解决这个问题，Redis从2.6开始引入sentinel，用于监控和管理Redis的主从复制环境，进行自动failover，即Master挂了后，sentinel自动从从服务器选出一个Master使主从复制集群仍然可以工作，如果Master醒来再次加入集群，只能以从服务器的形式工作。   什么是Sentine
  • 使用代理实现Hibernate Dao层自动事务 白糖_ DAOspringAOP框架Hibernate
    都说spring利用AOP实现自动事务处理机制非常好，但在只有hibernate这个框架情况下，我们开启session、管理事务就往往很麻烦。 public void save(Object obj){ Session session = this.getSession(); Transaction tran = session.beginTransaction(); try
  • maven3实战读书笔记 braveCS maven3
    Maven简介 是什么？ Is a software project management and comprehension tool.项目管理工具 是基于POM概念(工程对象模型) [设计重复、编码重复、文档重复、构建重复，maven最大化消除了构建的重复] [与XP：简单、交流与反馈；测试驱动开发、十分钟构建、持续集成、富有信息的工作区]     功能：
  • 编程之美-子数组的最大乘积 bylijinnan 编程之美
    public class MaxProduct { /** * 编程之美 子数组的最大乘积 * 题目: 给定一个长度为N的整数数组，只允许使用乘法，不能用除法，计算任意N-1个数的组合中乘积中最大的一组，并写出算法的时间复杂度。 * 以下程序对应书上两种方法，求得“乘积中最大的一组”的乘积——都是有溢出的可能的。 * 但按题目的意思，是要求得这个子数组，而不
  • 读书笔记-2 chengxuyuancsdn 读书笔记
    1、反射 2、oracle年-月-日 时-分-秒 3、oracle创建有参、无参函数 4、oracle行转列 5、Struts2拦截器 6、Filter过滤器(web.xml) 1、反射 (1)检查类的结构 在java.lang.reflect包里有3个类Field,Method,Constructor分别用于描述类的域、方法和构造器。 2、oracle年月日时分秒 s
  • [求学与房地产]慎重选择IT培训学校 comsci it
          关于培训学校的教学和教师的问题,我们就不讨论了,我主要关心的是这个问题       培训学校的教学楼和宿舍的环境和稳定性问题       我们大家都知道，房子是一个比较昂贵的东西，特别是那种能够当教室的房子... &nb
  • RMAN配置中通道(CHANNEL)相关参数 PARALLELISM 、FILESPERSET的关系 daizj oraclermanfilespersetPARALLELISM
    RMAN配置中通道(CHANNEL)相关参数 PARALLELISM 、FILESPERSET的关系 转 PARALLELISM --- 我们还可以通过parallelism参数来指定同时"自动"创建多少个通道： RMAN > configure device type disk parallelism 3 ; 表示启动三个通道，可以加快备份恢复的速度。
  • 简单排序:冒泡排序 dieslrae 冒泡排序
    public void bubbleSort(int[] array){ for(int i=1;i<array.length;i++){ for(int k=0;k<array.length-i;k++){ if(array[k] > array[k+1]){
  • 初二上学期难记单词三 dcj3sjt126com sciet
    concert 音乐会 tonight 今晚 famous 有名的；著名的 song 歌曲 thousand 千 accident 事故；灾难 careless 粗心的，大意的 break 折断；断裂；破碎 heart 心（脏） happen  偶尔发生，碰巧 tourist 旅游者；观光者 science （自然）科学 marry 结婚 subject 题目；
  • I.安装Memcahce 1. 安装依赖包libevent Memcache需要安装libevent,所以安装前可能需要执行 Shell代码 收藏代码 dcj3sjt126com redis
    wget http://download.redis.io/redis-stable.tar.gz tar xvzf redis-stable.tar.gz cd redis-stable make   前面3步应该没有问题，主要的问题是执行make的时候，出现了异常。 异常一： make[2]: cc: Command not found 异常原因：没有安装g
  • 并发容器 shuizhaosi888 并发容器
       通过并发容器来改善同步容器的性能，同步容器将所有对容器状态的访问都串行化，来实现线程安全，这种方式严重降低并发性，当多个线程访问时，吞吐量严重降低。    并发容器ConcurrentHashMap       替代同步基于散列的Map，通过Lock控制。   &nb
  • Spring Security（12）——Remember-Me功能 234390216 Spring SecurityRemember Me记住我
    Remember-Me功能   目录   1.1     概述 1.2     基于简单加密token的方法 1.3     基于持久化token的方法 1.4     Remember-Me相关接口和实现
  • 位运算 焦志广 位运算
    一、位运算符Ｃ语言提供了六种位运算符： & 按位与 | 按位或 ^ 按位异或 ~ 取反 << 左移 >> 右移 1. 按位与运算 按位与运算符"&"是双目运算符。其功能是参与运算的两数各对应的二进位相与。只有对应的两个二进位均为1时，结果位才为1 ，否则为0。参与运算的数以补码方式出现。 例如：9&am
  • nodejs 数据库连接 mongodb mysql liguangsong mongodbmysqlnode数据库连接
    1.mysql 连接    package.json中dependencies加入     "mysql":"~2.7.0"    执行 npm install      在config 下创建文件 database.js    
  • java动态编译 olive6615 javaHotSpotjvm动态编译
        在HotSpot虚拟机中，有两个技术是至关重要的，即动态编译(Dynamic compilation)和Profiling。     HotSpot是如何动态编译Javad的bytecode呢？Java bytecode是以解释方式被load到虚拟机的。HotSpot里有一个运行监视器，即Profile Monitor,专门监视
  • Storm0.9.5的集群部署配置优化 roadrunners 优化storm.yaml
    nimbus结点配置（storm.yaml）信息： # Licensed to the Apache Software Foundation (ASF) under one # or more contributor license agreements. See the NOTICE file # distributed with this work for additional inf
  • 101个MySQL 的调节和优化的提示 tomcat_oracle mysql
    　1. 拥有足够的物理内存来把整个InnoDB文件加载到内存中——在内存中访问文件时的速度要比在硬盘中访问时快的多。 　　2. 不惜一切代价避免使用Swap交换分区 – 交换时是从硬盘读取的，它的速度很慢。 　　3. 使用电池供电的RAM（注：RAM即随机存储器）。 　　4. 使用高级的RAID（注：Redundant Arrays of Inexpensive Disks，即磁盘阵列
  • zoj 3829 Known Notation(贪心) 阿尔萨斯 ZOJ
    题目链接：zoj 3829 Known Notation 题目大意：给定一个不完整的后缀表达式，要求有2种不同操作，用尽量少的操作使得表达式完整。 解题思路：贪心，数字的个数要要保证比∗的个数多1，不够的话优先补在开头是最优的。然后遍历一遍字符串，碰到数字+1，碰到∗-1,保证数字的个数大于等1，如果不够减的话，可以和最后面的一个数字交换位置（用栈维护十分方便），因为添加和交换代价都是1
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他