伪类选择器冒号前加不加空格的问题

实例

    /*id选择器*/
    #bg-blue{
        /*background-color: lightblue;*/
    }

    /*class选择器*/
    .bg-green{
        /*background-color: lightgreen;*/
    }

    /*属性选择器:
    这里以用了id选择器为属性举例（li与[]之间没有空格，不然又变成子级元素了）*/

    li[id="bg-blue"]{
        /*border:red 2px solid;*/
    }
    /*由于前面列表里只有2用了id选择器，所以id里面的内容也可以省略,简写如下*/
    /*
    li[id]{
         border:red 2px solid;
        }
    */

    /*群组选择器*/
    #bg-blue,.bg-green{
        /*border:pink 4px dashed;*/
    }

    /*相邻选择器*/
/*顺序下去第一个，这里的li可以用*代替*/
    #bg-blue+li{
        /*background-color: tan;*/
    }

    /*兄弟同级选择器*/
/*顺序下去，所有同级元素*/
#bg-blue~li{
    /*background-color: gray;*/
}
/*这里的li理论上同样可以用*代替,但这里用*代替后内联块3颜色变化不对：*/
/*#bg-blue~*{*/
/*    background-color: gray;*/
/*}*/

/*伪类：子元素选择器*/
/*ul与：之间必须有空格，不然就变成整个ul标签的背景色了*/
ul :first-child {
    background-color: green;
}
ul :last-child{
    background-color: green;
}
ul :nth-child(6){
    background-color: green;
}
/*还有个倒选，nth-child(8)就等于nth-last-child(3)*/
ul :nth-last-child(3){
    background-color: green;
}

/*伪类：类型选择器*/
/*ul li:first-child{*/
/*    background-color: blueviolet;*/
/*    color: white;*/
/*}!*虽然这样写也可以，但是不规范，类型选择器我们有专用的选择器*!*/
ul li:last-of-type{
    background-color: blueviolet;
    color: white;
}
ul li:nth-of-type(6){
    background-color: blueviolet;
    color: white;
}

/*:nth-child()  关注点在子元素的“位置”*/
/*:nth-of-type()  关注点在子元素的“类型”==> li:nth-of-type()*/

div :nth-child(2){
    background-color: gold;
}
div:first-of-type :nth-child(3){
    /*background-color: blueviolet;*/
}
/*这里注意两个div后面的空格问题，div后面没有空格的那个可以看做父子关系，*/
/*相当于在div的子类下面用了伪类的子元素选择器*/
/*同样的效果，用一个简单地类型选择器（讲师说它是标签选择器）来简化上一个复杂的类型选择器*/
div p:nth-of-type(2) {
    background-color: blue;
}
/*用到类型选择器的时候，：前面是没有空格的*/


/*以下是表单的样式*/
form :enabled{
    background-color: tan;
}

form :checked+*{
    color: red;
}

/*当输入错误或者无效的数据格式时会被激活*/
form :invalid{
    color:red;
}

form :focus{
    background-color: dodgerblue;
}

/*hover鼠标悬停*/
button:hover{
    width: 60px;
    height: 30px;
    background-color: black;
    color: white;
    border: none;
}

伪类选择器里，到底什么时候需要在：前加空格。

疑问1：子类选择器前面加空格，类型选择器前面不加空格？？

疑问2：还有兄弟同级选择器中用*代替标签，理论上从相邻的选择器到最后一个同级都会被选中，那这里用*代替li出现相邻选择器未被选中（其他兄弟同级都被选中了）？？