Bald Monkey
Bald Monkey

CSS学习笔记03

CSS笔记03

盒子模型

什么是盒子模型

  • 概念：
    • CSS 盒子模型就是在网页设计中经常用到的一种思维模型，是 CSS 布局的基石，主要规定了元素是如何显示的以及元素间的相互关系。定义所有元素都可以有像盒子一样的平面空间和外形。包含内容区、内边距区、边框区和外边距区共四个区域，这就是盒子模型。
  • 组成：
    • margin：外边距区域
    • border：边框区域
    • padding：内边距区域
    • content ：内容区域

CSS学习笔记03_第1张图片

  • 盒子占用空间大小的计算方式：content +padding+border+margin

边框 - border

  • 设置边框：

    • border: 粗细 样式 颜色

  • 下面我们就通过写代码的方式来学习理解什么是边框以及怎样设置边框：

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>

    <style>
        /*
        body、h1等标签总有一个默认的外边距
        例如body的默认外边距 - margin: 8px;
        */
        /* 常见操作：初始化，去除默认外边距 */
        body,h2 {
            margin: 0;
        }

        /*
        设置边框 - border: 粗细 样式 颜色
        样式：
            solid - 实线
            dashed - 虚线
         */
        #box {
            width: 300px;
            border: 1px solid red;
        }

        h2 {
            font-size: 16px;
            background-color: red;
            line-height: 50px;
            color: white;
        }

        form {
            background: lightpink;
        }

        span {
            font-size: 14px;
            color: darkred;
        }

        /* 结构伪类选择器 + 后代选择器 */
        .inputs:nth-of-type(1) input {
            border: 3px solid black;
        }

        .inputs:nth-of-type(2) input {
            border: 3px dashed blue;
        }

        .inputs:nth-of-type(3) input {
            border: 3px dashed red;
        }
    style>

head>
<body>

<div id="box">
    <h2>会员登陆h2>
    <form action="#">
        <div class="inputs">
            <span>账号：span>
            <input type="text">
        div>
        <div class="inputs">
            <span>密码：span>
            <input type="text">
        div>
        <div class="inputs">
            <span>邮箱：span>
            <input type="text">
        div>
    form>
div>

body>
html>
  • 查看网页效果：

CSS学习笔记03_第2张图片

内外边距 - padding & margin

  • 内边距padding与外边距margin的设置方式大致相同，这里以外边距margin为例，它共有三种常用的设置方式：

    • margin: 0; - 表示上下左右外边距都为零。
    • margin: 0 auto; - 表示上下外边距都为0，左右外边距都为自动居中对齐（ auto）
      • 注意：使用margin: 0 auto;对元素进行居中操作的前提是该元素必须是块元素（display:block;），且有固定的宽度（如input、button、img等元素，自带宽度可以不用设置其宽度） 。
      • 可以通过对块级元素设置text-align：center;的方式来实现内联元素（如文本、图片）居中
      • margin:0 auto;可以使盒子居中，text-align:center;可以使此盒子内的内联元素居中，故有时需要两者结合使用才能使得盒子及其中的元素一起居中。
    • margin: 0 1px 2px 3px; - 表示上外边距为0，右外边距为1px，下外边距为2px，左外边距为3px（上右下左 --> 顺时针方向）。

  • 下面我们通过写代码的方式来学习理解什么是内外边距以及怎样设置内外边距：

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>

    
    
    <style>

        #box {
            width: 300px;
            border: 1px solid red;
            margin: 0 auto;
        }

        h2 {
            font-size: 16px;
            background-color: red;
            line-height: 50px;
            color: white;
            margin: 0;
            padding: 0 115px;
        }

        form {
            background: lightpink;
        }

        .inputs {
            padding: 10px 40px;
        }

        span {
            font-size: 14px;
            color: darkred;
        }

        input {
            border: 1px solid black;
        }

    style>

head>
<body>

<div id="box">
    <h2>会员登陆h2>
    <form action="#">
        <div class="inputs">
            <span>账号：span>
            <input type="text">
        div>
        <div class="inputs">
            <span>密码：span>
            <input type="text">
        div>
        <div class="inputs">
            <span>邮箱：span>
            <input type="text">
        div>
    form>
div>

body>
html>
  • 查看网页效果：

CSS学习笔记03_第3张图片

圆角边框

圆角边框的设置

  • CSS 属性border-radius允许你设置元素的外边框圆角。当使用一个半径时确定一个圆形，当使用两个半径时确定一个椭圆。这个（椭）圆与边框的交集形成圆角效果。
  • 示例：
DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>

    
    <style >
        div {
            width: 100px;
            height: 100px;
            border: 10px solid red;
            margin: 10px;
        }
        #box1 {
            border-radius: 20px;
        }
        #box2 {
            border-radius: 50px 10px;
        }
        #box3 {
            border-radius: 50px 30px 10px 0;
        }
        #box4 {
            border-radius: 60px;
        }
    style>

head>
<body>

<div id="box1">div>
<div id="box2">div>
<div id="box3">div>
<div id="box4">div>

body>
html>
  • 查看网页效果：

CSS学习笔记03_第4张图片

  • 关于上述圆形边框的理解可以参照下图：

CSS学习笔记03_第5张图片

圆角边框的应用

  • 我们可以利用圆角边框来绘制各种图形，制作圆形的头像等等：
  • 示例：
  • 准备一张正方形的头像图片：

CSS学习笔记03_第6张图片

  • 具体代码如下：
DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>

    <style>
        div {
            background: red;
            margin: 50px;
        }

        #box1 {
            width: 100px;
            height: 50px;
            border-radius: 50px 50px 0 0;
        }

        #box2 {
            width: 50px;
            height: 100px;
            border-radius: 0 50px 50px 0;
        }

        #box3 {
            width: 50px;
            height: 50px;
            border-radius: 50px 0 0 0;
        }

        img {
            border-radius: 50px;
            margin: 0 50px;
        }

        span {
            margin: 0 59px;
        }
    style>

head>
<body>

<div id="box1">div>
<div id="box2">div>
<div id="box3">div>
<img src="images/ProfilePic.png" alt="ProfilePicture">
<br/>
<span>头像span>

body>
html>
  • 查看网页效果：

CSS学习笔记03_第7张图片

盒子阴影

  • CSS box-shadow属性用于在元素的框架上添加阴影效果。
    • 具体用法如下box-shadow: 水平偏移量 垂直偏移量 阴影模糊半径 阴影颜色
  • 示例 - 利用box-shadow实现盒子的阴影效果以及头像图片的发光效果：
DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
head>
    
    <style>
        div {
            width: 100px;
            height: 100px;
            background-color: skyblue;
            margin: 100px auto;
            box-shadow: 20px 20px 5px black;
        }
        img {
            display: block;
            margin: 100px auto;
            border-radius: 50px;
            box-shadow: 0 0 100px yellow;
        }
    style>
<body>

<div>div>

<img src="images/ProfilePic.png" alt="ProfilePicture"/>


body>
html>
  • 查看网页效果：

CSS学习笔记03_第8张图片

拓展 - 关于快速搭建网站

  • 我们在设计编写前端页面的时候要避免 “重复造轮子” ，很多复杂的样式自己用 CSS 写起来很繁琐，我们没必要花费大量时间自己去编写。我们可以直接用开源网站上提供的源码或者使用 element-ui 这类网站上的组件来搭建我们的前端页面。

  • 推荐几个网站：

    • 源码之家 - 提供了很多网站设计的源码
    • 模板之家 - 提供了很多网站设计的模板
    • Element - 网站快速成型工具 - 提供了很多快捷搭建网站的组件

你可能感兴趣的:(css,学习,笔记)

  • java集合List，Set，Map怎么理解存储数据有序，无序以及可重复，不可重复 java程序员CC JAVA基础java面试list
    学习java已经有一段时间了，在练习开发项目的过程中经常用到List和Map却不知道其到底有何区别，今天整理了一下知识点对这几个进行浅显易懂的区分。PS:本文中的“有序”指的是存储数据时输入顺序与数据输出顺序相等，“唯一”：指的是不重复首先我们知道java集合有两个接口；一个是Collection,一个是Map;其中Colection衍生出了两个子接口也就是平时我们常见的--List【有序，不唯一
  • 【Golang学习】第十章 goroutine和channel Entin_7 Golang学习golang开发语言
    目录一、goroutine1.创建goroutine（1）格式（2）示例2.协程管理二、channel1.channel的创建2.channel的类型3.channel的读写操作4.channel的关闭5.channel的遍历6.channel与select配合使用7.通过channel实现goroutine的通信一、goroutinegoroutine是Go语言中的轻量级线程实现，由Go运行时（
  • SvelteKit 最新中文文档教程（8）—— 部署 Node 服务端
    前言Svelte，一个语法简洁、入门容易，面向未来的前端框架。从Svelte诞生之初，就备受开发者的喜爱，根据统计，从2019年到2024年，连续6年一直是开发者最感兴趣的前端框架No.1：Svelte以其独特的编译时优化机制著称，具有轻量级、高性能、易上手等特性，非常适合构建轻量级Web项目。为了帮助大家学习Svelte，我同时搭建了Svelte最新的中文文档站点。如果需要进阶学习，也可以入手我
  • LInux内核学习 -- perCPU变量 lagransun linux学习运维
    文章目录环境关于perCPU变量perCPU变量：__entry_task环境linux4.19关于perCPU变量percpu变量的介绍，这位老哥做了介绍，包括为什么要有这样的变量以及优势：linux内核之Per-CPU变量，我把这个老哥的总结复制下来：通过Per-cpu变量除了可以分配内存，还有一个最大的好处就是不需要考虑同步。最好的同步技术就是把不需要同步的内核放在首位，因为每种显示的同步原
  • Tinyflow AI 工作流编排框架 v0.0.7 发布 自不量力的A同学 人工智能
    目前没有关于TinyflowAI工作流编排框架v0.0.7发布的相关具体信息。Tinyflow是一个轻量的AI智能体流程编排解决方案，其设计理念是“简单、灵活、无侵入性”。它基于WebComponent开发，前端支持与React、Vue等任何框架集成，后端支持Java、Node.js、Python等语言，助力传统应用快速AI转型。该框架代码库轻量，学习成本低，能轻松应对简单任务编排和复杂多模态推理
  • Linux内核学习之 -- epoll()一族系统调用分析笔记 lagransun linux学习笔记
    背景linux4.19epoll()也是一种I/O多路复用的技术，但是完全不同于select()/poll()。更加高效，高效的原因其他博客也都提到了，这篇笔记主要是从源码的角度来分析一下实现过程。作为自己的学习笔记，分析都在代码注释中，后续回顾的时候看注释好一点。相关链接：Linux内核学习之–ARMv8架构的系统调用笔记Linux内核学习之–系统调用open()和write()的实现笔记Lin
  • 《Armv8/armv9架构入门指南》-【第十四章】多核处理器 Arm精选 ARM-TEE-Androidarmv8armv9多核处理DSU嵌入式
    快速链接:.ARMv8/ARMv9架构入门到精通-[目录]付费专栏-付费课程【购买须知】:联系方式-加入交流群----联系方式-加入交流群个人博客笔记导读目录(全部)
  • AI工具如何改变编程学习？Trae IDE与Claude 3.5的实践案例 黑金IT AI智能AI编程fasttify人工智能学习ide
    在现在这个到处都是电脑和手机的时代，AI工具正在变成编程学习和开发的好帮手。今天，咱们就来好好聊聊AI工具，特别是TraeIDE和Claude3.5这两个工具，在学习FastAPI和构建知识图谱的时候有多厉害，还有它们对编程行业会有什么影响。一、AI工具：编程学习与开发的好帮手AI工具在编程学习和开发里，作用可太大了。就像TraeIDE和Claude3.5，它们能像好朋友一样，在写代码的时候帮忙检
  • 搜广推校招面经五十三 Y1nhl 搜广推面经python机器学习人工智能推荐算法搜索算法算法
    小红书推荐算法一、ESMM(EntireSpaceMulti-TaskModel)ESMM（EntireSpaceMulti-TaskModel）是一种用于解决推荐系统中多任务学习问题的模型。它由阿里巴巴团队提出，主要用于处理点击率（CTR）和转化率（CVR）的联合预测问题。1.1.背景在推荐系统中，CTR和CVR是两个重要的指标：CTR（Click-ThroughRate）：用户点击广告的概率。
  • 关于数组越界却不会报错 112233123hd 数据结构c++算法学习方法
    关于数组越界却不会报错数组越界是不一定报错的，系统对越界的检查是设岗检查。一，在进行顺序表的学习时遇到的问题，下面是代码，大家可以直接去看结论。voidTestSeqList1(){SLs1;SLInit(&s1);/*SLPushBack(&s1,1);SLPushBack(&s1,2);SLPushBack(&s1,3);SLPushBack(&s1,4);SLPushBack(&s1,5);
  • C语言复习笔记（一维数组） 会飞的CR7 C语言数组一维数组初始化数组元素
    数组是一组有序数据的集合，在程序设计中，为方便处理往往会把一些同类型的数据按有序的形式组织起来，且用一个统一的名字标识这组数据，这个名字就称为数组名，构成数组的每一数据称为数组元素或者下标变量。在C语言中，数组属于构造数据类型。一个数组可以包含多个数组元素，这些数组元素可以是基本数据类型或构造类型，按照数组的维数可以分为一维数组和多维数组，按照数组元素的类型，数组又可以分为数值型数组、字符型数组、
  • 使用 Milvus 进行向量数据库管理与实践 qahaj milvus数据库python
    技术背景介绍在当今的AI与机器学习应用中，处理和管理大量的嵌入向量是一个常见的需求。Milvus是一个开源向量数据库，专门用于存储、索引和管理深度神经网络以及其他机器学习模型生成的大规模嵌入向量。它的高性能和易用性使其成为处理向量数据的理想选择。核心原理解析Milvus的核心功能体现在其强大的向量索引和搜索能力。它支持多种索引算法，包括IVF、HNSW等，使其能够高效地进行大规模向量的相似性搜索操
  • 对象的行为-状态影响行为，行为影响状态 Java版蜡笔小新 java学习开发语言
    小白Java学习记录4一周掌握Java入门知识学习内容：对象的行为学习产出：你可以传值给方法d.bark(3);方法会运用形参。调用的一方会传入实参。实参是传给方法的值。当传入放后就成了形参。参数跟局部（local）变量是一样的。它有类型与名称，可以在方法内运用。重点是：如果某个方法需要参数，你就一定得传东西给它。那个东西得是适当类型的值。Dogd=newDog（）；d.bark（3）；voidb
  • C语言复习笔记6---while循环for循环 .又是新的一天. C语言复习笔记c语言算法c++
    感谢张学长为大家整理的笔记~考点整合A+B问题分离一个整数每一位从后往前从前往后→字符数组(字符串)/看成一堆字符栈(先入后出)→递归while→循环版的if（while循环的直接应用→模拟）gcd和lcm打擂法求max,min判断素数O(n)O(sqrt(n))→分离因子的快捷的求法打印素数表数列求和、斐波那契数列(递推)递推和递归递推往往用迭代(循环)来实现讲从前往后分离整数的递归写法实现方式
  • C语言复习笔记5---数组 .又是新的一天. C语言复习笔记c语言算法c++
    数组考点排序冒泡排序O(n^2)选择排序O(n^2)(插入排序)分离每一位正序逆序哈希(hash)→用值直接作为下标日期处理问题数组的基本操作插入和删除逆序（移位）7-19田忌赛马(双指针)二维数组→矩阵矩阵转置判断对称矩阵矩阵运算矩阵移位杨辉三角*知识点数组:存储若干个相同的数据类型的元素intchardoublefloatlonglong定义数组数据类型数组名[数组大小]inta[100];数
  • 《沉思录》 froxy 读书笔记程序人生
    《沉思录》是古罗马皇帝马可·奥勒留（MarcusAurelius）在戎马倥偬中写下的哲学笔记，也是斯多葛学派的重要代表作。全书以自我对话的形式，探讨了生命、死亡、责任、自然法则以及心灵的安宁。以下是总结与启示：《沉思录》的核心思想总结顺应自然与理性斯多葛哲学认为，宇宙是一个有序的整体，人应遵循自然法则（逻各斯），接受命运的安排。理性是人与神的共通点，通过理性控制欲望和情绪，才能获得内心的自由。专注
  • gcc version 11.4.0 (Ubuntu 11.4.0-1ubuntu1~22.04) 上编译问题笔记 老爸我爱你 开发语言c++
    编译错误如下：Infileincludedfrom/usr/include/glib-2.0/glib/glib-typeof.h:39,from/usr/include/glib-2.0/glib/gatomic.h:28,from/usr/include/glib-2.0/glib/gthread.h:32,from/usr/include/glib-2.0/glib/gasyncqueue.
  • MyBatis学习：基本使用 Landy_Jay mybatis学习java
    学习之前：MyBatis是一款优秀的持久层框架，它支持自定义SQL、存储过程以及高级映射。MyBatis免除了几乎所有的JDBC代码以及设置参数和获取结果集的工作。2.1向SQL语句传参2.1.1mybatis日志输出配置MyBatis配置文件详解：官方文档：mybatis–MyBatis3|简介标签：用于选择MyBatis配置环境的标签，如开发、测试和生产环境需要不同的配置。更换环境，只需更开标
  • c++类和对象(中篇)上 朽棘不雕 c++学习c++开发语言
    在上一篇博客中学习了一些类和对象的基础,下面让我们一起来看看这部分比较难以理解的重点部分吧.在中篇我主要学习了默认成员函数以及其中包含的运算符重载.在这篇中主要分享下默认成员函数的前三个.赋值函数以及其中包含的运算符重载的知识见下.类和对象的默认成员函数默认成员函数就是指在一个类中,就算用户没有显示实现,编译器也会自动生成的成员函数.在一个类中,编译器会默认生成6个成员函数.分别是构造函数,析构函
  • 【自学笔记】Web3基础知识点总览-持续更新 Long_poem 笔记web3
    提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录Web3基础知识点总览（Markdown格式）1.引言2.区块链基础3.智能合约4.去中心化应用（DApps）5.数字货币与钱包6.跨链技术7.Web3生态与工具代码块示例（Solidity智能合约）总结Web3基础知识点总览（Markdown格式）1.引言Web3，也称为第三代互联网或去中心化互联网，旨在通过区块链技术实现更
  • 物理学不存在了？诺贝尔物理学奖颁给了人工智能 资讯新鲜事 人工智能
    2024年10月8日，瑞典皇家科学院宣布，将2024年诺贝尔物理学奖授予美国普林斯顿大学教授约翰·J·霍普菲尔德（JohnJ.Hopfield）和加拿大多伦多大学教授杰弗里·E·辛顿（GeoffreyE.Hinton），以表彰他们“在人工神经网络机器学习方面的基础性发现和发明”。辛顿在接受电话采访时表示：“完全没想到”。实话实说，在结果出来前，大家也都没想到。因为在外界预测里，今年的诺贝尔物理学奖
  • MyBatis-plus 2.x -＞ 3.x 版本升级笔记 三只松鼠@ 工作日常springjavasql
    参考链接：https://github.com/baomidou/mybatis-plus/issues/32621.官方更新日志升级JDK8+优化性能Wrapper支持lambda语法模块化MP合理的分配各个包结构移除com.baomidou.mybatisplus.extension.injector.methods.additional包下的过时类fix:初始化TableInfo中遇到多个字
  • Vue3-笔记002-Ref与Reactive ·焱· vue3学习笔记笔记vue.jsjavascript
    002-Ref与Reactive-目录Refref案例ref与RefifRefshallowReftriggerRefcustomRefdom元素的refReactive与ref的共同点与ref的不同点数组的异步赋值问题readonlyshallowReactivetoReftoRefstoRawRef接受一个内部值并返回一个响应式且可变的ref对象。ref对象仅有一个.valueproperty
  • Python实战：开发经典猜拳游戏（石头剪刀布） 藍海琴泉 游戏
    目录引言：为什么选择猜拳游戏作为入门项目？第一部分：基础知识点与代码实现1.游戏逻辑与流程2.代码分步实现2.1导入必要模块2.2定义游戏规则函数2.3生成计算机选择2.4判断胜负逻辑2.5主循环与交互3.代码运行效果示例第二部分：功能扩展与优化1.添加计分系统2.支持多轮游戏与退出选择3.增加图形化界面（可选）第三部分：进一步学习方向1.深化游戏功能2.学习相关知识3.书籍与资源推荐适合人群：编
  • 蓝桥杯动态规划实战：从数字三角形到砝码称重 藍海琴泉 蓝桥杯动态规划职场和发展
    适合人群：蓝桥杯备考生|算法竞赛入门者|DP学习实践者目录一、我的动态规划入门之路1.数字三角形：经典DP首战告捷2.砝码称重：背包问题的变形二、蓝桥杯高频算法考点三、蓝桥杯DP专项训练题四、备考建议一、我的动态规划入门之路1.数字三角形：经典DP首战告捷题目描述：从三角形的顶部到底部有很多条不同的路径。对于每条路径，把路径上面的数加起来可以得到一个和，你的任务就是找到最大的和（路径上的每一步只可
  • element 源码学习三 —— select 源码学习 violet-jack JavaScript源码学习element组件库
    select选择器是个比较复杂的组件了，通过不同的配置可以有多种用法。有必要单独学习学习。整体结构以下是select的template结构，已去掉了一部分代码便于查看整体结构：{{selected[0].currentLabel}}1"type="info"disable-transitions>+{{selected.length-1}}{{item.currentLabel}}0&&!load
  • 鸿蒙特效教程09-深入学习animateTo动画 苏杰豪 HarmonyOSNext鸿蒙特效教程harmonyos学习华为
    鸿蒙特效教程09-深入学习animateTo动画本教程将带领大家从零开始，一步步讲解如何讲解animateTo动画，并实现按钮交互效果，使新手也能轻松掌握。效果演示通过两个常见的按钮动画效果，深入学习HarmonyOSNext的animateTo动画，以及探索最佳实践。缩放按钮效果抖动按钮效果一、基础准备1.1理解ArkUI中的动画机制HarmonyOS的ArkUI框架提供了强大的动画支持，常见有
  • API 测试 承悦不会玩 API
    前提概要本文章主要用于分享API测试基础学习，以下是对API测试的一些个人解析，请大家结合参考其他文章中的相关信息进行归纳和补充。API测试描述什么是API？API是应用程序编程接口（ApplicationProgrammingInterface）的缩写。它是一组定义、协议和工具，用于让不同的软件应用程序之间进行交互和通信。以下从几个方面为你详细介绍API：功能：1.提供服务接口2.数据交互工作原
  • 如何用PHP开发一个api数据接口 幽蓝计划 php
    对于一个iOS开发者来说，我一直觉得会写接口是一件很酷的事情，因为它可以实时修改前台数据，而不像App一样需要更新版本和接受审核。更重要的是，它意味着你的技术完成了一个闭环，可以独自完成一整个项目的开发。PHP是我接触的第一个脚本语言，使用之后更是感觉PHP功能强大，开发过程非常友好方便，虽然之后也学习过Python、JavaScript等语言，但现在还是习惯使用PHP，下面就来介绍一下如何用PH
  • 【AI大模型应用开发】【RAG评估】0. 综述：一文了解RAG评估方法、工具与指标 同学小张 大模型人工智能笔记经验分享gptagiAIGC
    大家好，我是同学小张，日常分享AI知识和实战案例欢迎点赞+关注，持续学习，持续干货输出。+v:jasper_8017一起交流，一起进步。微信公众号也可搜【同学小张】本站文章一览：前面我们学习了RAG的基本框架并进行了实践，我们也知道使用它的目的是为了改善大模型在一些方面的不足：如训练数据不全、无垂直领域数据、容易出现幻觉等。那么如何评估RAG的效果呢？本文我们来了解一下。文章目录推荐前置阅读0.R
  • 安装数据库首次应用 Array_06 javaoraclesql
    可是为什么再一次失败之后就变成直接跳过那个要求 enter full pathname of java.exe的界面 这个java.exe是你的Oracle 11g安装目录中例如：【F:\app\chen\product\11.2.0\dbhome_1\jdk\jre\bin】下的java.exe 。不是你的电脑安装的java jdk下的java.exe！ 注意第一次，使用SQL D
  • Weblogic Server Console密码修改和遗忘解决方法 bijian1013 Welogic
            在工作中一同事将Weblogic的console的密码忘记了，通过网上查询资料解决，实践整理了一下。 一.修改Console密码         打开weblogic控制台，安全领域 --> myrealm -->&n
  • IllegalStateException: Cannot forward a response that is already committed Cwind javaServlets
    对于初学者来说，一个常见的误解是：当调用 forward() 或者 sendRedirect() 时控制流将会自动跳出原函数。标题所示错误通常是基于此误解而引起的。 示例代码： protected void doPost() { if (someCondition) { sendRedirect(); } forward(); // Thi
  • 基于流的装饰设计模式 木zi_鸣 设计模式
    当想要对已有类的对象进行功能增强时，可以定义一个类，将已有对象传入，基于已有的功能，并提供加强功能。 自定义的类成为装饰类 模仿BufferedReader，对Reader进行包装，体现装饰设计模式 装饰类通常会通过构造方法接受被装饰的对象，并基于被装饰的对象功能，提供更强的功能。 装饰模式比继承灵活，避免继承臃肿，降低了类与类之间的关系 装饰类因为增强已有对象，具备的功能该
  • Linux中的uniq命令 被触发 linux
    Linux命令uniq的作用是过滤重复部分显示文件内容，这个命令读取输入文件，并比较相邻的行。在正常情 况下，第二个及以后更多个重复行将被删去，行比较是根据所用字符集的排序序列进行的。该命令加工后的结果写到输出文件中。输入文件和输出文件必须不同。如 果输入文件用“- ”表示，则从标准输入读取。 AD： uniq [选项] 文件 说明：这个命令读取输入文件，并比较相邻的行。在正常情况下，第二个
  • 正则表达式Pattern 肆无忌惮_ Pattern
    正则表达式是符合一定规则的表达式，用来专门操作字符串，对字符创进行匹配，切割，替换，获取。   例如，我们需要对QQ号码格式进行检验 规则是长度6~12位  不能0开头  只能是数字，我们可以一位一位进行比较，利用parseLong进行判断，或者是用正则表达式来匹配[1-9][0-9]{4,14} 或者 [1-9]\d{4,14} &nbs
  • Oracle高级查询之OVER (PARTITION BY ..) 知了ing oraclesql
    一、rank()/dense_rank() over(partition by ...order by ...) 现在客户有这样一个需求，查询每个部门工资最高的雇员的信息，相信有一定oracle应用知识的同学都能写出下面的SQL语句： select e.ename, e.job, e.sal, e.deptno from scott.emp e, (se
  • Python调试 矮蛋蛋 pythonpdb
    原文地址： http://blog.csdn.net/xuyuefei1988/article/details/19399137 1、下面网上收罗的资料初学者应该够用了，但对比IBM的Python 代码调试技巧： IBM：包括 pdb 模块、利用 PyDev 和 Eclipse 集成进行调试、PyCharm 以及 Debug 日志进行调试： http://www.ibm.com/d
  • webservice传递自定义对象时函数为空，以及boolean不对应的问题 alleni123 webservice
    今天在客户端调用方法 NodeStatus status=iservice.getNodeStatus(). 结果NodeStatus的属性都是null。 进行debug之后，发现服务器端返回的确实是有值的对象。 后来发现原来是因为在客户端，NodeStatus的setter全部被我删除了。 本来是因为逻辑上不需要在客户端使用setter， 结果改了之后竟然不能获取带属性值的
  • java如何干掉指针，又如何巧妙的通过引用来操作指针————>说的就是java指针 百合不是茶
    C语言的强大在于可以直接操作指针的地址，通过改变指针的地址指向来达到更改地址的目的,又是由于c语言的指针过于强大，初学者很难掌握， java的出现解决了c，c++中指针的问题 java将指针封装在底层，开发人员是不能够去操作指针的地址，但是可以通过引用来间接的操作：   定义一个指针p来指向a的地址（&是地址符号）：        
  • Eclipse打不开，提示“An error has occurred.See the log file ***/.log” bijian1013 eclipse
    打开eclipse工作目录的\.metadata\.log文件，发现如下错误： !ENTRY org.eclipse.osgi 4 0 2012-09-10 09:28:57.139 !MESSAGE Application error !STACK 1 java.lang.NoClassDefFoundError: org/eclipse/core/resources/IContai
  • spring aop实例annotation方法实现 bijian1013 javaspringAOPannotation
            在spring aop实例中我们通过配置xml文件来实现AOP，这里学习使用annotation来实现，使用annotation其实就是指明具体的aspect,pointcut和advice。1.申明一个切面(用一个类来实现)在这个切面里,包括了advice和pointcut AdviceMethods.jav
  • [Velocity一]Velocity语法基础入门 bit1129 velocity
    用户和开发人员参考文档 http://velocity.apache.org/engine/releases/velocity-1.7/developer-guide.html   注释 1.行级注释## 2.多行注释#*  *#   变量定义 使用$开头的字符串是变量定义，例如$var1, $var2,   赋值 使用#set为变量赋值，例
  • 【Kafka十一】关于Kafka的副本管理 bit1129 kafka
    1. 关于request.required.acks   request.required.acks控制者Producer写请求的什么时候可以确认写成功，默认是0， 0表示即不进行确认即返回。 1表示Leader写成功即返回，此时还没有进行写数据同步到其它Follower Partition中 -1表示根据指定的最少Partition确认后才返回，这个在   Th
  • lua统计nginx内部变量数据 ronin47 lua nginx　 统计
    server { listen 80; server_name photo.domain.com; location /{set $str $uri; content_by_lua ' local url = ngx.var.uri local res = ngx.location.capture(
  • java-11.二叉树中节点的最大距离 bylijinnan java
    import java.util.ArrayList; import java.util.List; public class MaxLenInBinTree { /* a. 1 / \ 2 3 / \ / \ 4 5 6 7 max=4 pass "root"
  • Netty源码学习-ReadTimeoutHandler bylijinnan javanetty
    ReadTimeoutHandler的实现思路： 开启一个定时任务，如果在指定时间内没有接收到消息，则抛出ReadTimeoutException 这个异常的捕获，在开发中，交给跟在ReadTimeoutHandler后面的ChannelHandler，例如 private final ChannelHandler timeoutHandler = new ReadTim
  • jquery验证上传文件样式及大小(好用) cngolon 文件上传jquery验证
    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="jquery1.8/jquery-1.8.0.
  • 浏览器兼容【转】 cuishikuan css浏览器IE
    浏览器兼容问题一：不同浏览器的标签默认的外补丁和内补丁不同 问题症状：随便写几个标签，不加样式控制的情况下，各自的margin 和padding差异较大。 碰到频率:100% 解决方案：CSS里    *{margin:0;padding:0;} 备注：这个是最常见的也是最易解决的一个浏览器兼容性问题，几乎所有的CSS文件开头都会用通配符*来设
  • Shell特殊变量：Shell $0, $#, $*, $@, $?, $$和命令行参数 daizj shell$#$?特殊变量
    前面已经讲到，变量名只能包含数字、字母和下划线，因为某些包含其他字符的变量有特殊含义，这样的变量被称为特殊变量。例如，$ 表示当前Shell进程的ID，即pid，看下面的代码： $echo $$ 运行结果 29949   特殊变量列表 变量 含义 $0 当前脚本的文件名 $n 传递给脚本或函数的参数。n 是一个数字，表示第几个参数。例如，第一个
  • 程序设计KISS 原则-------KEEP IT SIMPLE, STUPID! dcj3sjt126com unix
    翻到一本书，讲到编程一般原则是kiss：Keep It Simple, Stupid.对这个原则深有体会，其实不仅编程如此，而且系统架构也是如此。 KEEP IT SIMPLE, STUPID! 编写只做一件事情，并且要做好的程序；编写可以在一起工作的程序，编写处理文本流的程序，因为这是通用的接口。这就是UNIX哲学.所有的哲学真 正的浓缩为一个铁一样的定律，高明的工程师的神圣的“KISS 原
  • android Activity间List传值 dcj3sjt126com Activity
    第一个Activity： import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;import android.app.Activity;import android.content.Intent;import android.os.Bundle;import a
  • tomcat 设置java虚拟机内存 eksliang tomcat 内存设置
    转载请出自出处：http://eksliang.iteye.com/blog/2117772 http://eksliang.iteye.com/ 常见的内存溢出有以下两种: java.lang.OutOfMemoryError: PermGen space java.lang.OutOfMemoryError: Java heap space   ------------
  • Android 数据库事务处理 gqdy365 android
    使用SQLiteDatabase的beginTransaction()方法可以开启一个事务，程序执行到endTransaction() 方法时会检查事务的标志是否为成功，如果程序执行到endTransaction()之前调用了setTransactionSuccessful() 方法设置事务的标志为成功则提交事务，如果没有调用setTransactionSuccessful() 方法则回滚事务。事
  • Java 打开浏览器 hw1287789687 打开网址open浏览器open browser打开url打开浏览器
    使用java 语言如何打开浏览器呢? 我们先研究下在cmd窗口中,如何打开网址 使用IE 打开 D:\software\bin>cmd /c start iexplore http://hw1287789687.iteye.com/blog/2153709 使用火狐打开 D:\software\bin>cmd /c start firefox http://hw1287789
  • ReplaceGoogleCDN：将 Google CDN 替换为国内的 Chrome 插件 justjavac chromeGooglegoogle apichrome插件
    Chrome Web Store 安装地址： https://chrome.google.com/webstore/detail/replace-google-cdn/kpampjmfiopfpkkepbllemkibefkiice 由于众所周知的原因，只需替换一个域名就可以继续使用Google提供的前端公共库了。 同样，通过script标记引用这些资源，让网站访问速度瞬间提速吧
  • 进程VS.线程 m635674608 线程
    资料来源： http://www.liaoxuefeng.com/wiki/001374738125095c955c1e6d8bb493182103fac9270762a000/001397567993007df355a3394da48f0bf14960f0c78753f000 1、Apache最早就是采用多进程模式 2、IIS服务器默认采用多线程模式 3、多进程优缺点 优点： 多进程模式最大
  • Linux下安装MemCached 字符串 memcached
    前提准备：1. MemCached目前最新版本为：1.4.22，可以从官网下载到。2. MemCached依赖libevent，因此在安装MemCached之前需要先安装libevent。2.1 运行下面命令，查看系统是否已安装libevent。[root@SecurityCheck ~]# rpm -qa|grep libevent libevent-headers-1.4.13-4.el6.n
  • java设计模式之--jdk动态代理（实现aop编程） Supanccy2013 javaDAO设计模式AOP
        与静态代理类对照的是动态代理类，动态代理类的字节码在程序运行时由Java反射机制动态生成，无需程序员手工编写它的源代码。动态代理类不仅简化了编程工作，而且提高了软件系统的可扩展性，因为Java 反射机制可以生成任意类型的动态代理类。java.lang.reflect 包中的Proxy类和InvocationHandler 接口提供了生成动态代理类的能力。 &
  • Spring 4.2新特性-对java8默认方法(default method)定义Bean的支持 wiselyman spring 4
    2.1 默认方法(default method) java8引入了一个default medthod; 用来扩展已有的接口,在对已有接口的使用不产生任何影响的情况下,添加扩展 使用default关键字 Spring 4.2支持加载在默认方法里声明的bean 2.2 将要被声明成bean的类 public class DemoService {
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他