首页 > 其他分享 >CSS2学习随笔

CSS2学习随笔

时间:2022-10-29 15:12:24浏览次数:49  
标签:CSS2 border 元素 学习 background overflow 随笔 margin 选择器

CSS

  • CSS:层叠样式表(Cascading Style Sheets) 修饰网页,且能配合js对原有样式进行更改。
    • css的层叠性:一个元素可能同时被多个css选择器选中,每个选择器都有一些css规则,这就是层叠。 这些规则有可能不矛盾的,自然这些规则将会同时起效,然而有些规则是相互冲突的。当发生冲突的时候必须选出一条最高特殊性(权重)的规则来应用。
<!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>
    <!-- 引入外部css rel用于定义文档关联,表示关联样式表  type定义文档类型 -->
    <link rel="stylesheet" href="../css/1.css" type="text/css">
    <!-- 内部编写css -->
    <style>
        div {
            background-color: brown;
            color: #fff;
            font-size: 66px;
        }
    </style>
</head>

<body>
    <!-- 行内样式 -->
    <div style="width:500px; height: 500px;">今晚月亮真美</div>
</body>

</html>

目录

语法

选择器{
		属性:属性值;
		属性:属性值;
		.....
		}

引入方式

行内样式 直接在标签里面书写

  • <标签名 style=" 属性:属性值;属性:属性值;...."></标签名>
    
    • 优点:
      • 方便简介
    • 缺点:
      • 只能修饰一个标签,重复性高
      • 结构和样式在一起,代码杂乱
      • 不利于后期维护

内部样式 在head头部部分书写

  • <head><style>选择器{属性:属性值;属性:属性值;...}</style></head>
    
    • 优点:
      • 结构和样式分离,
    • 缺点:
      • 在同一个页面,不太方便操作

外部样式 在外面创建css文件,在html中引入css文件

  • <head><link rel="stylesheet" href="css文件名" type="text/css"></head>
    
    • 做到了结构和样式分离,方便后期维护;是日常开发中最常用的方式

特殊外部引入 在head头部书写

  • <head><style>@import url("css文件名")</style></head>
    
    • 面试题:
      @import引入外部样式和通过link标签引入外部样式的区别?

      1. @import的方式是属于css的语法,必须写在style标签里面。
      2. 加载顺序不同,link引入的css样式表是同步加载的,而@import这种 方式是先加载页面,再加
        载样式。在网速差的时候有区别。
      3. 浏览器的支持情况不同。@import引入的样式在老版本浏览器(ie5以下)中不被支持
      4. Dom操作不同。通过@import导入的样式,是不同通过Dom操作改变样式的

引入效果的权重 (就近原则)

  • 同一个标签同时用三种样式表:行内>外部和内部

  • 同一个标签同时用外部和内部:就近原则,css与对象直线距离最近

  • 如何让外部样式比行内样式的权重?

    • 在外部样式需要提升权重的属性值后,分号前写入 !important

    • div{
          background-color: green!important;
      }
      

CSS选择器

基本选择器

  • 标签选择器 div{color:red:}
  • class选择器 <div class="box”> .div{color: brown;}
  • id选择器(全局只使用一次) <div id="box”> #div{color: brown;}
  • 通配符选择器 *{ }
  • 群组选择器 .box,.box1,.box2{ }

层次选择器

  • 后代选择器(包括所有叫div的子孙后代) .box div{}
  • 子代选择器 所有叫div的儿子 .box>div{}
  • 相邻兄弟 选择器1+选择器2{} 后面的一个兄弟 .div+.div1{}
  • 通用兄弟 选择器1~选择器2{} .box .p1~.p6{}

伪类选择器

属性选择器

伪对象(伪元素)选择器

选择器权重

层叠性:当属性相同时,遵循就近原则。当属性不同时,进行叠加。

选择器的权重值:
*             0000
div           0001
.box          0010
#box          0100
行类样式       1000
!important   10000

.box div      10+1
  • id选择器>标签选择器
  • id选择器>class选择器
  • class选择器>标签选择器
  • 标签选择器>通配符选择器

伪类

 		a:link {
            color: tomato;
        }
        a:visited {
            color: gold;
        }
        a:hover{
            color: green;
        }
        a:active{
            color:aqua;
        }
  • 选择器:link{} 实现点击前效果
  • 选择器:visited{} 实现点击后效果
  • 选择器:hover{} 实现鼠标经过效果
  • 选择器:active{} 鼠标点下到鼠标松开的效果
    • 同时使用时,顺序不能改变l-v-h-a
    • a标签点击前是蓝色,点击后是紫色

文字样式

文字大小 font-size:;

说明:
1) 属性值为数值型时,必须给属性值加单位,属性值为0时除外。
2)单位还可以是pt,9pt=12px;
3)为了减小系统间的字体显示差异,IE Netscape Mozilla的浏览器制作商于1999年召开会议,共同确定16px/ppi为标准字体大小默认值,即1em.默认情况下,1em=16px,0.75em=12px; rem
4)使用绝对大小关键字
xx-small =9px
x-small =11px
small =13px
medium =16px
large =19px
x-large =23px
xx-large =27px

文字颜色 color: ;

  • red
  • 十六进制
    • A-F 1-9进行6位数组合
      • ffffff

      • cccccc

      • 123123

      • ff1122==>#f12

  • rgba(red,green,blue,alpha)
    • alpha 取值范围 0-1 0透明 1不透明
    • red,green,blue取值范围0-255

文字字体:font-family:;

  • 可以同时引入多个字体,字体之间用逗号隔开
  • 默认从左边第一个开始识别,遇到能识别的字体就进行显示,如果都不能识别就显示浏览器默认字体(微软雅黑)
  • 字体由多个单词构成或者中文字体需要用引号包括
  • 中文字体和英文字体同时引入时,需要把英文字体靠左边

文字加粗: font-weight:;

  • 关键词
    • bold加粗
    • bolder更粗(效果和bold一样,强调)
    • normal 常规
    • lighter 轻量的,细体
  • 数值
    • 取值范围100-900
    • 400以下细体
    • 600以上粗体

文字倾斜:font-style:;

  • italic 倾斜
  • oblique 倾斜(如果italic不生效就用oblique)
  • normal 常规的

首行缩进:text-indent:;

  • em是相对单位,相当于文本大小

  • 如果文字大小为16px,则1em=16px

文本水平对齐: text-align:;

  • left
  • right
  • center
  • justify 两端对齐
    • text-align-last:justify;单行两端对齐

行高: line-height:;(两行文字基线到基线的距离)

  • 顶线
  • 中线
  • 基线
  • 底线
  • line-height:height; 只有一行文本时,行高=高可实现文本垂直居中
  • 行高=1时可以清除行高

字符字间隙:letter-spacing:;

单词词间距:word-spacing:;

(上划,下划,删除)线 text-decoration:;

  • overline 上划线
  • underline 下划线
  • line-through 删除线
  • none 取消所有线
    • 三线共行: text-decoration:overline underline line-through;

文字样式的复合写法:

  • font:倾斜 加粗 字号/行高 字体样式;
    • 例:font:italic bold 16px/16px '楷体';
  • 注意:不能改变其顺序,且最少需要同时设置字号和字体样式

背景

背景颜色background-color:;

  • 关键词: red
  • 十六进制
    • A-F 1-9进行6位数组合
      • ffffff

      • cccccc

      • 123123

      • ff1122==>#f12

  • rgba(red,green,blue,alpha)
    • alpha 取值范围 0-1 0透明 1不透明
    • red,green,blue取值范围0-255

背景图片 background-image:url();

  • 不会占据页面的位置
  • 括号里面引号可写可不写
  • 可以有多背景,用逗号隔开,先引入的显示在上面

背景图片平铺background-repeat:;

  • repeat 平铺
  • no-repeat 不平铺
  • repeat-x 水平平铺
  • repeat-y 垂直平铺

背景图片定位 background-positon:x y;

  • 数值:
    • backgroun-position:20px -50px;
    • x越往左越大,x越往下越大
    • 可取负数
  • 关键词:垂直参数top center botton;水平参数 left center right
    • backgrou-position:center center;==>background-position:center;

背景图片大小background-size:长 宽;

  • 数值:可写一个值,也可以写两个值,也可以百分比
  • 关键词:
    • cover 将图片按比例放大填充满页面,多余的部分裁剪掉
    • contain 将图片原本大小按比例放入页面

背景图片固定:background-attachment:;

  • fixed 相当于浏览器窗口固定(默认效果)
  • scroll 跟随页面滚动

背景图片的复合写法: background:yellow url()no-repeat center top/cover fixed;

  • 颜色 路径 平铺 位置/尺寸 定位
  • 参数可以根据实际情况省略(写尺寸,必须搭配位置一起使用)

列表

表单 list-style-type:;

  • disc
  • circle
  • square
  • none

列表图片 list-style-image:url();

  • 列表左边的小图标

列表图片位置 list-style-position:;

  • outside 外面
  • inside 里面

列表复合 list-style:;

  • list-style:inside url()disc;
  • 常用:list-style:none;

表格

border-spacing:0;取消单元格与单元格的距离

border-collapse:; 合并边框线

  • separate(默认)分开的
  • collapse 合并线条

empty-cells:;隐藏空单元格(border-collapse会让它失效)

  • hide

table-layout:;表格大小算法

  • fixed 固定 (固定宽度,不会随内容多少改变单元格宽度)
    优点:固定,加快运行的速度,允许浏览器更快的对表格进行布局。
    缺点:不够灵活),内容足够多的时候,会产生折行

  • auto 自动的(列的宽度是由列单元格中没有折行的最宽的内容设定的。)

    (优点:比较灵活,文本多的时候,可以直接撑开
    缺点:较慢(因为它需要在确定最终的布局前访问表格中的所有内容)。

浮动float

  • float:;

    • left
    • right
    • none
  • 清除浮动clear:;

    • clear:left;
    • clear:right;
    • clear:both;

浮动的特征:

1.原本纵向排列的元素会横着排列,兄弟关系的时候,前面的元素浮动,后面元素会进行补位

2.兄弟关系中,如果所有的元素都添加浮动,元素都会脱离文档流,然后挨着横向显示

3.如果行放不下:会折行显示

浮动带来的影响:

元素浮动.-=>脱离文档流,不占据页面空间,不参与高度计算---》如果父元素没有高度,则父元素的高度会产生塌陷效果。

如何解决高度塌陷问题?

1.添加一个空的元素(块级元素,比如div) ,给这个元素添加clear : both;就可以清除浮动带来的影响

2.给父元素固定的高度

3.添加伪类,给伪类设置清除浮动的样式

div:after{

content:"' ;

display:block;转化元素类型

clear:both;清除浮动

}

4.给父元素设置overflow:hidden;触发bfc(块级格式化上下文)

边框 border

复合写法border:1px solid red;

三个必须一起使用才有效果

  • border-width
  • border-color
  • border-style
    • solid 实线
    • dashed 虚线
    • double 双线
    • dotted 点状线
  • 练习:三角形和风车

间距

外间距margin:;

m0-20快速生成margin:0 20px;

  • 负值,auto(使用前提:盒子要有宽度,不能有浮动和定位)(auto运用于页面版心)

  • 单一外间距:margin-left:; margin-right:; margin-top:; margin-bottom:;

  • 简写:

    • margin:10px ; 上下左右外间距为10px
    • margin;10px 20px; 上下10 左右20
    • margin:10px 20px 30px ; 上10 左右20 下30
    • margin: 10px 20px 30px 40px;上10 右20 下30 左40
  • bug:

  • 一、margin-top的传递问题:
    父子关系中,一个父元素,当给子元素添加margin-top时,子元素的margin-top会传递给父元素。
    解决办法:
    1.给最近的父元素添加溢出隐藏overflow:hidden;触发bfc
    2.给父元素添加border:1px solid transparent;( transparent透明的实线)

    3.将子元素margin换成父元素padding

  • 二、margin外间距重叠问题:
    兄弟关系中,两个上下相邻的盒子,给上面盒子添加margin-bottom,下面添加margin-top,这两个盒子垂直方向外间距会取最大值(水平方向会相加两个值)
    解决办法:给下面盒子创建一个父元素并声明overflow:hidden;

内间距padding:;

  • padding会把盒子撑大

  • 没有负值和auto

  • 单一写法和简写和margin一样

盒子模型 组成content+padding+border+margin

标准盒子模型box-sizing:content-box;

  • 标准盒子模型的width(自己设置的width:10px;)===content

  • 盒子大小=content(10px)+padding+border

  • 实际占据空间:content+padding+border+margin

怪异盒子模型box-sizing:boder-box;

  • 怪异盒子模型(自己设置的width:10px;)===content+padding+border

  • 盒子大小: 设置的值(10px)

  • 占据空间:设置的值+margin

盒子溢出overflow:;

  • overflow:;
    • visible 可见的(默认)
    • hidden 隐藏
    • auto 自动判断,超出时出现滚动条
    • overflow-x:scroll;超出后水平方出现向滚动条
    • overflow-y:scrol;
  • 隐藏滚动条
    ::-webkit-scrollbar {
    display: none;}

单行文本溢出显示小圆点:(overflow:hidden; white-space:nowrap;text-overflow:ellipsis;+宽度)

  p{
            width:200px;
            height: 200px;
            line-height: 16px;
            background-color:brown;
            
            overflow: hidden;
            white-space:nowrap;
            text-overflow: ellipsis;
        }

white-space:;剩余空间

  • normal 折行(默认)
  • nowrap不折行
  • pre 不折行保留空格(回车会有折行效果)
  • pre-wrap 折行保留空格
  • pre-line 折行清除空格

text-overflow:ellipsis;小圆点(搭配overflow:hidden;)

多行文本溢出显示小圆点:

 p{
            width:200px;
            line-height: 16px;
            background-color:brown;

            overflow: hidden;/*溢出隐藏*/
            text-overflow: ellipsis;/*溢出小圆点*/
            display: -webkit-box;/*将对象设置为弹性伸缩盒子模型显示*/
            -webkit-box-orient: vertical;/*从上到下排列元素 还有个值horizontal水平的*/
            -webkit-line-clamp: 2;/*不属于css规范属性,必须结合上面两行代码才有效果,表示显示的行数*/
        }

width(不写高度)

overflow:hidden;

text-overflow:ellipsis;

display:-webkit-box;

-webkit-box-orient:vertical;

-webkit-line-clamp:2;

元素类型

行内(内联)元素

span,a, b ,strong,em,del,u

  • 多个行内元素横向排列,设置宽高不生效

  • display:inline;

块元素

p,div,h1-h6,hr,ul,ol,li,dl,dt,dd,form,fieldset,legend

  • 纵向排列,独占一行,可以设置宽高
  • display:block;

行内块元素(内联块)

img,input,textarea select

  • 横着排列,可以设置宽高
  • display:inline-block;
  • img的display的值是inline,但表现特征是行内块元素

其他分类:置换元素(替换元素)与非置换元素

  • 置换元素(相对于行内块元素)
含义:一个内容不受CSS视觉格式化模型控制,CSS渲染模型并不考虑对此内容的渲染,且元素本身一般拥有固有尺寸(宽度,高度,宽高比)的元素,被称之为置换元素。
      
      ``特征:在不使用css修饰时,元素的标签和属性也会影响元素的显示
      ``可以近似理解成:内联块元素就是置换元素

img/input/textarea/canvas/select/iframe/object

  • 非置换元素:除了置换元素以外的元素就是非置换元素

display:;

  • inline 行类
  • block 块
  • inline-block 行内块
  • list-item 列表
  • none 隐藏
  • table 表格
  • table-cell表格单元格/row表格的行/row-group表格的行分组

行内块元素的对齐方式:

  • vertical-align:;
    • baseline 基线对齐(默认)
    • middle 中线对齐
    • bottom 底线对齐
  • 两个行内块文本为兄弟时,如果第一个行类块文本是多行,第二个行内块会按照第一个行类块最后一行文本排列

图片的居中对齐:

vertical-align:middle;给图片父元素 line-height:height;text-align:center;

图片和块元素之间存在3-6px的间距:

原因:1.行内块元素的对齐方式是基线对齐。2.本质而言是元素类型不同

解决:1.vertical-align的值不为baseline。2.将图片的display的值为block;

元素类型分为:块元素、行内元素 其中img标签属于行内元素但也属于置换元素, 置换元素本身一般拥有固有尺寸(宽度,高度,宽高比),这些元素往往没有实际的内容,即是一个空元素,置换元素就是浏览器根据元素的属性和属性值,来决定元素的具体显示内容,大部分的置换元素的元素类型为inline-block;被称之为置换元素,所以置换元素可以直接设置大小。

定位 position:;

配合方位属性使用,值为0,也将方位属性写上

相对定位relative

参照物:原来的位置(原位置仍然保留)

固定定位fixed

参照物:浏览器窗口(脱离文档流)

静态定位static (默认值)

参照物:正常文档流

使用方位属性不生效

粘性定位sticky

参照物:初始情况下在正常文档流中,达到一定条件(top值)则参照浏览器窗口(原位置保留)

特征:当页面向上滚动时,当前元素始终停留在页面窗口内

绝对定位:absolute

参照物:相对于最近一级有定位(除static定位)的祖先元素,如果所有祖先元素都没有定位的话就相对于浏览器窗口。(脱离文档流)

注意:如果使用了margin:auto;再使用absolute,auto会失效。

绝对定位脱离文档流是全脱离,可以触发bfc(解决margin-top的传递问题)

定位(fixed和absolute)和浮动的区别:

  • 浮动:半脱离文档流(文字环绕效果)可以触发bfc(解决margin-top的传递问题)

    定位:全脱离文档流(文字遮挡效果)可以触发bfc(解决margin-top的传递问题)

  • 浮动:让纵向排列的元素横向排列

​ 定位:通过某种方式让元素进行位置移动

  • fixed/absolute/float都会让margin:auto;失效

  • 都会让行内元素变成块元素(效果:宽高生效)

父相子绝(父绝子绝/父固定定位子绝)

为什么要父亲相对定位,儿子绝对定位:因为父亲用绝对和固定定位会导致margin:auto失效

定位后的层叠顺序:

  • z-index 层叠顺序 z-index属性不带单位,默认值为auto 理解为0,可以给负值。(定位以后才能使用)
  • 没设置z-index时,最后写的对象会显示在最上面,
  • 设置后,设置后数值越大越靠上

利用定位让元素居中

1.使用absolute/fixed(用relative的话left:50%参照物会有问题),top和left:50%;再margin-top:元素高度的一半;和margin-left:元素宽度的一半;

2.div{width:200px;height:200px;background:#f00;position:fixed;left:0;right:0;top:0;bottom:0;margin:auto;}

3.calc 计算函数 支持+-
注意点:符号周围必须添加空格

.box {
				width: 400px;
				height: 300px;
				background-color: red;
				text-align: center;
				line-height: 300px;
				position: absolute;
				/* 	calc 计算函数 支持+-
				注意点:符号周围必须添加空格 */
				top: calc(50% - 150px);
				left: calc(50% - 200px);

			}

宽高自适应

宽高自适应:

  • 宽度自适应:

    • 不给盒子设置宽度就是宽度自适应,默认情况下会找父元素或浏览器窗口的100%

    • 宽度取值 auto和100%的区别:

      • 元素没有添加盒子模型:效果一样

      • 元素添加了盒子模型:

        • 设置100%的情况

          • 实际宽度:100%+盒子模型 =100%+padding+border
        • 设置auto的情况

          • 实际宽度:父元素或浏览器窗口的100%
  • 高度自适应:

    不给盒子设置高度就是高度自适应,由内容(文字,padding,border,图片)撑开。(默认值为auto)

    • 设置固定高度缺点:
      • 1.如果内容再次增加,会产生溢出,需要重新设置高度

      • 2.如果内容很少,会有大量留白,页面不美观

    解决办法:使用高度自适应

    • min-height:;最小高度

    • max-height:;最大高度

    • min-width:;最小宽度

    • max-height:;最大宽度

窗口自适应:

效果:窗口放大缩小不会有滚动条

html,body{height:100%;}

布局

左右布局:

  • 左固定右边自适应

    • 左边宽高固定,右边宽100%,高固定;左边左浮动,右边margin-left:左边盒子的宽;
  • 使用 calc()函数 +-*/都可计算

    作用:动态计算高度或者宽度的剩余

    • 左边宽高固定,右边宽calc( 100% - 左边的宽度),左右都浮动
    • 注意:运算符左右需要用空格隔开

上下布局:

  • 上面固定,下面自适应

左中右布局:

  • 左右固定,中间自适应
    • 左右设置宽高且分别左右浮动。中间设置高度,不设置宽度,margin:左右盒子的宽度;
      • 注意:需要把中间盒子要放在最后面
  • 全部左浮动,左右设置固定宽度,中间用calc(100% - 左右的宽度)

BFC 块级格式化上下文(block formatting contexts)

概念:

特征:

  1. 盒子内部不影响外部元素影响,也不影响外部
  2. 触发bfc,里面的浮动元素也会参加高度计算
  • 触发bfc的方法:(解决高度塌陷和子元素的margin-top作用于父元素问题)
    1. html本身就是一个bfc
    2. overflow的取值不为visible;可以取值hidden/scroll/auto
    3. float的值不为none;可以取值left/right
    4. 能够脱离文档流的定位absolute/fixed
    5. display取值不为none;可取:inline-block;flex;inline-flex;inline-flex;table-cell,table-caption,

万能清除法:给父元素

父元素::after{
content:;
display:block;
clear:both;
width:0;
height:0;
transform:scale(0);
opacity:0;
visibility:hidden;
width:0;
height:0;
}

为什么不推荐overflow:hidden;解决高度塌陷问题

  • 因为overflow:hidden;会使元素溢出后隐藏看不见,容易导致盒子里面的元素被隐藏。

隐藏元素的区别:

  • display:none;不占位隐藏
  • opacity:0;占位隐藏
  • visibility:hidden;占位隐藏
  • transform:scale(0); 占位隐藏 scale缩放

重置样式

@charset "utf-8";
html,body,ol,ul,li,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select{margin:0;padding:0;}
body{
    font-size:16px;
    font-family: '微软雅黑';
}
ul,ol,li{
    list-style:none;
}
h1,h2,h3,h4,h5,h6{
    font-size:16px;
    font-weight: normal;
}
b,strong{
    font-weight: normal;
}
i,em{
    font-style: normal;
}
a,u{
    text-decoration: none;
}
img{
    border:0;
    display:block;
}
input,fieldset{
    outline: none;
    border:0;
}
.clear_fix:after{
    content:'.';
    clear:both;
    height:0;
    overflow:hidden;
    display:block;
    visibility: hidden;
}
.clear_fix{
    zoom:1;
}

标签:CSS2,border,元素,学习,background,overflow,随笔,margin,选择器
From: https://www.cnblogs.com/SenorCoconut/p/16838766.html

相关文章

  • CSS3学习随笔
    CSS3css3是css2的升级,相比新增主要内容css选择器,和css属性新增内容:语言模块,背景,列表,边框,文本,盒子特效,多列目录CSS3渐进增强和优雅降级(面试题)渐进增强优雅降级选择器属性......
  • MySQL学习笔记(sql语句为主)
    MySQL学习笔记MySQL实战应用根据老杜mysql的课程内容整理的学习笔记命令行基本操作登录mysql(cmd)://显示密码的形式mysql-uroot-pabc123//隐藏密码的形式mysql-......
  • golang学习之路1-环境安装及Helloword
    提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档@目录Golang学习之路前言一、安装环境1.Golang安装2.GoLand安装二、第一个go程序HelloWord三、go命令......
  • golang学习之路2-基础认识(上)
    @目录前言一、变量定义1.变量2.数据类型二、自增自减三、指针1.使用指针&及*2.空指针3.指针完整代码四、不支持语法1.自增自减--i及++i2.不支持内存地址(指针)加减3.......
  • java学习 2022年10月29日13:26:28
    packagecn.tedu.type1;publicclassForDemo{publicstaticvoidmain(String[]args){outer:for(intj=1;j<10;j++){for(inti=0;i......
  • 2022-2023-1 20221322《计算机基础与程序设计》第九周学习总结
    作业信息这个作业属于哪个课程<班级的链接>(2022-2023-1-计算机基础与程序设计)这个作业要求在哪里<作业要求的链接>(2022-2023-1计算机基础与程序设计第九周作业......
  • golang 学习入门项目(超适合新手入门,新手进阶)
    过年的疫情,让我有了时间整理自己的博客。这篇是关于如何学习golang这门语言的。实例代码一分享到github点击获取源码 ​​github学习golang​​本项目是个gogin框架写的......
  • php学习笔记二:第一个php程序 hello world!
    第一个php程序helloworld!前提条件:已经安装xampp和phpstorm xampp安装到了D:\xampp1打开phpstorm2新建项目保存项目到 D:\WorkTest\Php3添加index.php文件4......
  • php学习笔记一:开发环境选择
    1.开发工具使用 PhpStorm  对比过PhpStorm、zendstudio、eclipse和vs.php后还是选择了 PhpStorm,相关优缺点可以网上找找。2.部署工具使用xampp3.帮助文档​​http......
  • 【Vue2.0学习】—路由的两种工作模式(六十六)
    【Vue2.0学习】—路由的两种工作模式(六十六)对于一个url来说,什么是hash值?#以及后面的内容就是hash值hash值不会包含在HTTP请求中,即:hash值不会带给服务器hash模式:地址中永远带......