CSS笔记

最新推荐文章于 2024-07-18 16:29:57 发布
最新推荐文章于 2024-07-18 16:29:57 发布
阅读量131 收藏
点赞数
文章标签： java 网络 udp
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44042813/article/details/123322012
版权

概述

  • 查看一个网页的源码，在console会有惊喜留言
  • CSS（Cascading Style Sheet）：CSS1。CSS2提出div，html与CSS分离的思想。CSS3:圆角，阴影，动画
  • CSS利用SEO（Search Engine Optimization），易于被搜索引擎收录

三种样式style

  • 行内样式、内部样式、外部样式：就近原则
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/style.css">
    <style>
        h1{
            color: green;
        }
       
        /*导入式：@import "css/style.css";*/
    </style>
</head>
<body>

<h1 style="color: red">adair</h1>

</body>
</html>

=====================================================
#css/style.css
h1{
    color: yellow;
}

选择器(重要)

  • 选择页面上的某一或某一类元素

基本选择器

  • 优先级：标签选择器 < 类选择器 < Id选择器。都在<style>中
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>  
        /*标签选择器*/
        h1{
            color: yellow;
        }
        
        /*类选择器*/
        .style{
            color:cyan;
        }
       
        /*id选择器*/
        #adair{             /*id仅供全局使用一次*/
            color: red;
        }
    </style>

</head>
<body>

<h1 class="style" id="adair" >你好</h1>
<h1 class="style">你好</h1>
<h1>你好</h1>
<h1>你好</h1>

</body>

层次选择器

<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>

        /*后代选择器*/
        body p{
            color: red;
        }

        /*子选择器*/
        body>p{
            background: cyan;
        }

        /*相邻兄弟选择器：此选择的下一个兄弟邻居*/
        .next+p{
            border-radius: 10px;
        }

        /*通用兄弟选择器:不包含自己*/
        .usual~p{
            font-size: 40px;
        }
    </style>
</head>
<body>

    <p>p0</p>
    <p class="next">p1</p>
    <p class="usual">p2</p>
    <p>p3</p>
    <ul>
        <li>
            <p>p4</p>
        </li>
        <li>
            <p>p5</p>
        </li>
        <li>
            <p>p6</p>
        </li>
    </ul>
    <p>p7</p>
    <p>p8</p>


</body>

结构伪类选择器

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
    
        ul li:first-child{
            color: red;
        }
        ul li:last-child{
            color: green;
        }

        /*选择p父亲的第三个孩子*/
        p:nth-child(3){
            color: red;
        }
        /*选择p父亲的第三个p孩子*/
        p:nth-of-type(3){
            color: yellow;
        }
        a:hover{
            background: black;
        }
    </style>
</head>
<body>

<a href="">123</a>
<h1>h1</h1>
<p>p1</p>
<p>p2</p>
<p>p3</p>
<ul>
    <li>p4</li>
    <li>p5</li>
    <li>p6</li>
</ul>

</body>

属性选择器(常用)

  • class+id的形式
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
        .demo a{
            float: left;
            display: block;
            height: 50px;
            width: 50px;
            border-radius: 10px;
            background: blue;
            margin-right: 10px;
            text-align: center;
            color: red;
            text-decoration: none;
            font: bold 20px/50px Arial;
        }
        /*存在id的a标签*/
        a[id]{
            background: yellow;
        }
        /*存在id=first的a标签*/
        a[id="first"]{
            background: green;
        }
        /*选中
            class = "link" 是绝对等于link的
            class*="link"   为包含这个元素link的
        */
        a[class*="link"]{
            background: yellow;
        }
        /*选中
            ^= 以什么符号开始
            $= 以什么符号结尾
        */
        a[href^="https"]{
            background: red;
        }
        a[href$="pdf"]{
            background: cyan;
        }
    </style>

</head>
<body>

<p class="demo">
    <a href="https://www.baidu.com" class="link item first" id="first">1</a>
    <a href="image/1.pdf" class="link item">2</a>
    <a href="" class="link first">3</a>
    <a href="" class="item first">4</a>
    <a href="" class="link">5</a>
    <a href="" class="item">6</a>
</p>

</body>
  • 常用的表达式

#在class中的

*=
#在href中的
^=
$=

美化网页

  • 作用：提高用户体验，凸显页面主题

span标签：重点突出的字，用span标签套起来

<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
        #title1{
            font-size: 50px;
        }
    </style>
</head>
<body>

欢迎学习 <span id="title1">Java</span>

</body>

字体样式

#其中font-size和font-family必须有
font: font-style font-variant font-weight font-size/line-height font-family

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        body{
            font-family: "Arial Black",楷体;
        }
        h1{
            font-size: 50px ;
        }
        .p1{
            font-weight: bolder;
        }
        p{
            font: italic lighter 16px "楷体";
        }

    </style>
</head>

<body>

<h1>故事简介</h1>
<p class="p1">
《魁拔》是2008年北京青青树动漫科技有限公司以系列动画电影的第一部《魁拔之十万火急》为基础，
重新剪辑而成的TV动画。由王川执导，田博、马华等编剧，刘婧荦，竹内顺子等配音。
</p>

</body>

文本样式

  • 基本格式：对齐方式、首行缩进、行高、装饰
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <!--
    颜色:
        单词
        RGB:#000000(前2为R,中2为G,后2为B)
        RGBA:alpha为透明度
    text-align:文本对齐
    text-indent: 文本缩进，2em为2个字，2px为两个像素
	text-decoration: none;

    -->
    <style>
        h1{
            color: #FF00FF;
            color: rgba(255,255,0,0.5);
            text-align: center;
        }
        .p1{
            text-indent: 2em;
        }
        /*
        height: 300px;      p2有多高
        line-height: 300px; 每行有多高
        */
        .p2{
            background: cyan;
            height: 300px;
            line-height: 300px;
        }
        .l1{
            text-decoration: overline;
        }
        .l2{
            text-decoration: line-through;
        }
        .l3{
            text-decoration: underline;
        }
        /*a标签去掉下划线*/
        a{
            text-decoration: none;
        }
        /*文本和图片居中*/
        img,span{
            vertical-align: middle;
        }
    </style>
</head>
<body>

<p>
    <img src="image/1.jpg" alt="">
    <span>123</span>
</p>

<a href="">123</a>
<p class="l1">12345</p>
<p class="l2">12345</p>
<p class="l3">12345</p>

<h1>故事介绍</h1>

<p class="p1">
《魁拔》是2008年北京青青树动漫科技有限公司以系列动画电影的第一部《魁拔之十万火急》为基础，重新剪辑而成的TV动画。
由王川执导，田博、马华等编剧，刘婧荦，竹内顺子等配音。
</p>

<p class="p2">
TV版完整保留了电影的世界观、人物设定、故事内容和情节主线，但重制了片头曲。
《魁拔妖侠传》是魁拔系列电影的前传，主要讲述的是有关卡拉肖克潘家族的故事，与电影关系并不大。
大家所说的魁拔通常指魁拔系列动画电影。
</p>

</body>

超链接伪类

  • 对连接的处理

a{ }
a:hover{ }
a:active{ }

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>

        /*超链接伪类*/
        a{
            text-decoration: none;
            color: black;
        }
        a:hover{
            color: orange;
        }
        a:active{
            color: blue;
            font-size: 60px;
        }

        /*阴影*/
        #price{
            text-shadow: red 10px 10px 1px;
        }
    </style>
</head>
<body>

<a href="#">
    <img src="image/1.jpg" alt="">
</a>
<p>
    <a href="#">学习Java</a>
</p>
<p>
    <a href="">adair</a>
</p>
<p id="price">
    ￥：99
</p>

</body>

a列表中镶嵌图片

#background:颜色 图片 位置 平铺方式
background: red url("../image/down.jpeg") 270px 10px no-repeat;

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body>
<div id="nav">
    <h2 class="title">全部数字</h2>
    <ul>
        <li><a href="">10</a>&nbsp;&nbsp;<a href="">11</a>&nbsp;&nbsp;<a href="">12</a></li>
        <li><a href="">20</a>&nbsp;&nbsp;<a href="">21</a>&nbsp;&nbsp;<a href="">22</a></li>
        <li><a href="">30</a>&nbsp;&nbsp;<a href="">31</a>&nbsp;&nbsp;<a href="">32</a></li>
        <li><a href="">40</a>&nbsp;&nbsp;<a href="">41</a>&nbsp;&nbsp;<a href="">42</a></li>
    </ul>
</div>

</body>
==============================================

#nav{
    width: 300px;
    background: cyan;
}

.title{
    font-weight: bold;
    font-size: 18px;
    line-height: 35px;

    text-indent: 1em;
    /*background:颜色 图片 位置 平铺方式*/
    background: red url("../image/down.jpeg") 270px 10px no-repeat;
}

/*
list-style:
       none
       circle
       decimal
       square
*/
ul{

}
ul li{
    height: 30px;
    text-indent: 1em;
    list-style: none;
    background: url("../image/right.jpeg") 230px 1px no-repeat;
}
a{
    color: black;
    text-decoration: none;
}
a:hover{
    color: orange;
}

背景

  • 第一个实验
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
        div{
            width:700px;
            height: 500px;
            border: 2px solid red;
            /*默认图片是平铺的*/
            background-image: url("image/1.jpg");
        }
        .div1{
            background-repeat: repeat-x;
        }
        .div2{
            background-repeat: repeat-y;
        }
        .div3{
            background-repeat: no-repeat;
        }
    </style>

</head>
<body>

<div class="div1">erg</div>
<div class="div2">erg</div>
<div class="div3">erg</div>

</body>

#图片是否重复
background-repeat:

  • 第二个实验
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body>
<div id="nav">
    <h2 class="title">全部数字</h2>
    <ul>
        <li><a href="">10</a>&nbsp;&nbsp;<a href="">11</a>&nbsp;&nbsp;<a href="">12</a></li>
        <li><a href="">20</a>&nbsp;&nbsp;<a href="">21</a>&nbsp;&nbsp;<a href="">22</a></li>
        <li><a href="">30</a>&nbsp;&nbsp;<a href="">31</a>&nbsp;&nbsp;<a href="">32</a></li>
        <li><a href="">40</a>&nbsp;&nbsp;<a href="">41</a>&nbsp;&nbsp;<a href="">42</a></li>
    </ul>
</div>


</body>
===========================================================

#nav{
    width: 300px;
    background: cyan;
}


.title{
    font-size: 18px;
    font-weight: bold;
    text-indent: 1em;
    line-height: 35px;
    /*颜色 图片 位置 平铺方式*/
    background: red url("../image/down.jpeg") 270px 10px no-repeat;
}
/*
list-style:
       none
       circle
       decimal
       square
*/
ul{
    background: gray;
}
ul li{
    height: 30px;
    list-style: none;
    text-indent: 1em;
    background: url("../image/right.jpeg") 230px 1px no-repeat;

}
a{
    color: black;
    text-decoration: none;
}
a:hover{
    color: orange;
}

渐变

  • https://www.grabient.com/这个网站有渐变，直接复制CSS代码即可
background-image: linear-gradient(160deg, #0093E9 0%, #10f612 100%);

盒子模型

三类型边框

  • 盒子模型的大小：margin+border+padding+具体内容

margin：外边距
border：边框
padding：内边距
#border:粗细 虚实 颜色
#font:

<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
        /*magin:
                0
                0 auto
                0 1px 2px 3px (顺时针)
        */
        body{
            /*body总有一个默认的margin*/
            margin: 0px;
        }
        /*border:粗细 虚实 颜色*/
        #box{
            width: 300px;
            border: 1px solid red;
            margin: 0 auto;/*如果没有width则居中不生效*/
        }
        h2{
            font-size: 16px;
            background: blue;
            line-height: 30px;
            color: white;
        }
        form{
            background: cyan;
        }
       input{
           border:1px solid black;
       }
        /*?????????????????*/
        div:nth-of-type(1){
            /*background: black;*/
            padding: 10px;
        }
        #id2{
            margin: 0 auto;
        }
    </style>
</head>
<body>

<div id="box">
    <h2>用户登陆</h2>
    <form action="#">
        <div>
            <span>用户登陆：</span>
            <input type="text">
        </div>
        <div>
            <span>输入密码：</span>
            <input type="password">
        </div>
        <div>
            <span>输入邮箱：</span>
            <input type="email">
        </div>
        <input type="submit">
    </form>
</div>

<!--??????????????????为何两个都不居中,第二个加width可以居中-->
<p style="margin: 0 auto " >123</p>
<div id="id2">123</div>

</body>

圆角边框

  • 实验一
/*border-radius:
                10px
                50px 20px
                50px 20px 10px 5px(顺时针)
        */
border-radius: 20px 110px 0 0;
  • 实验二
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>

        img{
            display: block;
            margin: 0 auto;
            border-radius: 100px;
        }
    </style>
</head>
<body>

<!--方式一：让img为盒子模型-->
<div>
    <img src="image/4.jpg" alt="">
</div>

<!--让div表现为居中，则旗下的所有元素居中-->
<div style="text-align: center">
    <img src="image/4.jpg" alt="">
</div>

</body>

阴影

border: 10px solid red;
#下面两个差不多
text-shadow: 2px 2px 2px #ff0000;
box-shadow: 10px 10px 5px #888888;

<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
        div{
            width: 100px;
            height: 100px;
            border: 10px solid red;
            box-shadow: 10px 10px 3px yellow;
        }

    </style>

</head>
<body>

<div></div>

</body>

浮动

标准文档流

  • 块级元素：独占一行

h1~h6、p、div、列表……

  • 行内元素：不独占

span、a、img、strong……

display

<!--display：
        block:块级元素
        inline:行内元素
        inline-block:是块元素，但是可以内联，在一行
        none:消失
-->

这也是实现行内排版的方式，不过大部分用float

float

#在style.css中
.layer02{
    border: 1px #F00 dashed;
    display: inline-block;
    float: left;
}

float就简单理解为像气球一样漂浮在网页上

父级边框塌陷的问题

  • clear
/*clear
    left:左侧不允许有浮动元素
    both:两边不允许有浮动元素
*/
.layer02{
    border: 1px #F00 dashed;
    display: inline-block;
    float: left;
    clear: both;
}

解决方案

  1. 增大父级元素的height
  2. 在父级元素下，利用.clear类
<div id="father">
    <div class="layer01" ><img src="image/1.jpg" alt=""></div>
    <div class="layer02" ><img src="image/2.jpg" alt=""></div>
    <div class="layer03" ><img src="image/3.jpg" alt=""></div>
    <div class="layer04">
        这是文字
    </div>
    <div class="clear"></div>
</div>
=========================
#style.css下
.clear{
    clear: both;
}
  1. overflow ???
<div id="father">
    <div class="layer01" ><img src="image/1.jpg" alt=""></div>
    <div class="layer02" ><img src="image/2.jpg" alt=""></div>
    <div class="layer03" ><img src="image/3.jpg" alt=""></div>
    <div class="layer04">
        这是文字
    </div>
    <div class="clear"></div>
</div>
=========================
#style.css下

#father{
    border: 1px #000 solid;
    overflow: hidden;
}

尽量避免使用这种

  1. 父类中添加一个伪类：after（推荐使用）
#style.css下

#father:after{
    content: "";
    display: block;
    clear: both;
}

对比

  • display：方向不可控制

  • float：浮动起来的话会脱离标准文档流，要解决父级边框塌陷问题

定位

相对定位

  • 相对于原来的方向(top、left)进行移动，但是仍在标准文档流中（父级不塌陷）
#first{
    border: 2px dashed #ff0000;
    background-color: #10f612;
    position: relative;/*相对定位*/
    top:-20px;
    left: 20px;
}
  • 实验：五个粉色方块链接
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
        #box{
            width: 300px;
            height: 300px;
            padding: 10px;
            border: 2px solid red;
        }
        a{
            display: block;
            width: 100px;
            height: 100px;
            text-decoration: none;
            background-color: #FF00FF;
            line-height: 100px;
            text-align: center;
            color: white;
        }
        a:hover{
            background: blue;
        }
        .a2,.a4{
            position: relative;
            top: -100px;
            left: 200px;
        }

        .a5{
            position: relative;
            top: -300px;
            left: 100px;
        }
    </style>

</head>
<body>

<div id="box">
    <a class="a1" href="#">链接1</a>
    <a class="a2" href="#">链接2</a>
    <a class="a3" href="#">链接3</a>
    <a class="a4" href="#">链接4</a>
    <a class="a5" href="#">链接5</a>
</div>



</body>

绝对定位

定位：基于xx定位，上下左右

  • 在父级元素没有定位的情况下，相对于浏览器定位
  • 若父级元素定位，则相对父级元素进行偏移
#在style的标签内
#father{
border: 2px solid #ff0000;
position: relative;
}
#second{
    border: 2px dashed #ff0000;
    background-color: #9e10f6;
    position: absolute;
    left: -10px;
}

固定定位fixed

  • 例如B站返回顶部的小火箭
div:nth-of-type(1){/*绝对定位：此时相对于浏览器，在右下角*/
    width: 100px;
    height: 100px;
    background: red;
    position: absolute;
    right: 0;
    bottom: 0;

}
div:nth-of-type(2){/*固定定位*/
    width: 50px;
    height: 50px;
    background: orange;
    position: fixed;
    right: 0;
    bottom: 0;

}

z-index

  • 图层的概念

opacity: 0.5;//不透明度
z-index: 2

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>

<div id="content">
    <ul>
        <li><img src="image/bg.jpg" alt=""></li>
        <li class="tipText">学习找adair</li>
        <li class="tipBg"></li>
        <li>时间：2022-3-6</li>
        <li>地点：中国大学</li>

    </ul>
</div>


</body>
</html>
====================================
#style.css
#content{
    margin: 0;
    padding: 0;
    width: 700px;
    overflow: hidden;
    font-size: 12px;
    line-height: 25px;
    border: 1px solid red;
}
ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
/*父级定位*/
#content ul{
    position: relative;
}
.tipText, .tipBg{
    position: absolute;
    width: 300px;
    height: 25px;
    top: 100px;

}
.tipText{
    color: white;
    z-index: 2;

}
.tipBg{

    background: #000000;
    opacity: 0.5;
}

动画

总结

adair-zhang
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
css笔记
qq_53231262的博客
01-23 1345
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结css基础选择器1. css选择器的作用2. 选择器分类01-标签选择器02-类选择器03-id选择器04-通配符选择器05-总结css字体属性1. 字体体系2. 字体大小3. 字体粗细4. 文字样式5. 文字复合属性写法6. 字体属性总结css文本属性1. 文本颜色2. 对齐文本3. 装饰文本4. 文本缩进5. 行间距6. 文本总结css的引入方式1. 三种样式表2
028_CSS外边距
aihiao的专栏
10-15 258
1. 围绕在元素边框的空白区域是外边距。设置外边距会在元素外创建额外的"空白"。 3. CSS margin属性 3.1. 设置外边距的最简单的方法就是使用margin属性。 3.2. margin属性接受任何长度单位, 可以是像素、英寸、毫米、em或百分数值甚至负值。margin还可以设置为auto, 浏览器计算外边距。 3.3. 还可以为margin设置一个百分比数值: p {margin : 10%;} 3.4. 百分数是相对于父元素的width计算的。上面这个例子为p元素设置的外边距是
html五种css选择器,五种css选择器的基础练习
weixin_35192322的博客
06-03 445
CSS的三种选择器在其中我对标签、类、id三种选择器进行了详细的讲解 下面是我在复习之中，找到的一个css选择器的练习，其中除了刚说到的三种还讲到了后代/属性两选择器的特点；CSS选择器/* 为了看着方便给所有标签都加上边框，及设置一些默认的样式 */body,input{font-size:18px;}input{border: 2px solid green;}div,span,p{borde...
CSS学习笔记
m0_58761900的博客
09-18 3047
5.1 边框:border 5.2 内边距：padding 5.3 外边距:margin 5.4 块级元素的水平居中 7.1 弹性布局：flex 7.2 水平方向的排列方式：justify-content 7.3 垂直方向的排列方式：align-items
css 笔记2
m0_68844946的博客
06-13 1730
这是div标签</div>复合属性：属性的简写方式，一个属性对应多个值的写法，各个属性值之间用空格隔开。} </style> <div id="red">这是div标签
CSS笔记（精简）
weixin_46160720的博客
03-11 4483
CSS笔记 HTML 前端教程 前端笔记
CSS笔记II
皮鞭蘸碘伏边抽边消毒
01-15 1265
CSS3最全笔记 ，非常详细，HTML5+CSS3 详细完全体笔记
B站pink老师HTML+CSS笔记
m0_56428225的博客
07-20 3086
b站pinkl老师HTML+css笔记（包括h5c3+移动端)
css笔记1
qq_61466402的博客
03-13 7634
目录 css语法 实例 例子解释 css选择器 css使用 三种使用css的方法 外部 CSS 内部 CSS 行内 CSS 多个样式表 层叠顺序 css注释 实例 实例 实例 HTML 和 CSS 注释 css颜色 css背景色 CSS 文本颜色 CSS 边框颜色 CSS 颜色值 实例 css背景 CSS background-color css背景图像 css背景重复 css背景附着 css背景简写 css语法 CSS 规则集（rule...
CSS笔记.pdf
07-14
1. **外部样式表**：通过`<link>`标签引用外部CSS文件，例如`<link rel="stylesheet" type="text/css" href="文件路径" />`，这种方式便于管理和复用样式，适用于大型项目。 2. **内部样式表**：在HTML文档的`<head>...
css笔记css笔记css笔记
04-03
在网页设计领域，CSS（层叠样式表）扮演着至关重要的角色，它使得网页的布局、字体、颜色、背景等视觉元素得以精确控制。CSS 的引入解决了早期纯 HTML 页面表现与结构混合的问题，实现了内容与样式的分离，提高了...
《JavaSE》---6.＜基础语法（Java三大程序控制结构）＞
m0_73456341的博客
07-14 829
本篇博客主要讲解Java基础语法中的三大结构，一种顺序结构、两大分支结构i（if-else、swich-case）、四大循环结构（while、do while、fot、foreach）
Spring Security 授权
persistence_PSH的博客
07-14 901
在 loadUserByUsername 方法，在查询数据库用户信息的时候，同时查询出用户的权限，这里以角色名代指权限。在 loadUserByUsername 方法，在查询数据库用户信息的时候，同时查询出用户的权限，这里以角色名代指权限。在 loadUserByUsername 方法，在查询数据库用户信息的时候，同时查询出用户的权限，这里以角色名代指权限。通过 RBAC 获取到用户的具体权限后，再通过 Security 的 用户-权限-资源 来进行权限控制。HttpSecurity 权限配置。
【Go系列】 Sync并发控制
u013379032的博客
07-14 1022
在上一篇文章中，我们介绍了goroutine和channel，理论上，通过channel可以实现并发控制，但是其他语言的开发者可能更习惯一些原子操作的库。当然Go语言也会提供这样的库，所以我们今天了解一下sync库。
day04：Redis和店铺营业状态设置
m0_69266818的博客
07-15 829
介绍了Redis命令和用java操作redis还有营业额状态接口的书写
【Java算法】前缀和 下
最新发布
2302_79806056的博客
07-18 690
这段代码实现了一个寻找数组中具有相等数量的0和1的最长子数组长度的算法。具体来说，它使用了前缀和（prefix sum）的概念以及哈希映射（HashMap）来优化查找过程。初始化哈希映射：计算前缀和：检查相等数量的0和1：更新哈希映射：返回结果：这种方法的时间复杂度为O(n)，因为我们只遍历数组一次，并且对每个元素执行常数时间的操作。空间复杂度也是O(n)，最坏情况下需要存储n个前缀和值。 初始化阶段:开始遍历数组:继续
pink老师css笔记
08-17
很抱歉，我无法根据提供的引用内容回答你的问题，因为引用内容并没有提到"Pink老师CSS笔记"这个话题。如果你有关于"Pink老师CSS笔记"的具体问题，我将非常乐意帮助你回答。<span class="em">1</span><span class="em...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值