03 - CSS3知识点汇总一


本文是针对刚学编程的小白,都是一些基础知识,如果想了解更多深层一点的东西,欢迎移步本人博客!!
博客地址 点击跳转

内容LongLongLong是一种情怀

朋友总说我写的博客老长老长了,谁会有耐心去阅读呢 ? 而我觉得我把全部的知识概要罗列出来,每一个路过的人至少他不用费心竭力的去网上各种搜各种找,然后还外带各种坑,学习起来太费劲 ! 也不系统 ! 如果是一个真正想进入互联网行业,想成为一个真正的工程师的人,他应该不会觉得长的.希望我的文章对你有所帮助 !


CSS格式

  • 一定要用一对style标签包裹起来 而且必须要写在head标签之内 titile标签的下面
  • 示例代码 :
<style type="text/css">
        P{
            text-align: center;
            color: green;
        }
</style>

文字属性

  • 示例代码 :
<style>
        p{
            font-style: italic;
            /*快捷键*/
            /*fs font-style:italic; fs然后按Tab就会自动补全,其实想要写的代码首字母*/
            
            font-weight: bold;
            /*快捷键*/
            /*fwb font-weight:bold; fwb然后按Tab就会自动补全,其实想要写的代码首字母*/

            font-size: 30px;
            /*快捷键*/
            /*fz30 font-size:30px; */

            font-family: '楷体';
        }
</style>
  • 如果我们设置的字体用户电脑不存在,那么系统会用默认的字体来显示宋体
  • 如果设置的字体不存在,而我们又不想用默认的字体来显示怎么办?
  • 如果想给中文和英文分别单独设置样式怎么办?
  • 开发中一般常见的字体
    中文:宋体/黑体/微软雅黑
    英文:Arial/Time New Roma
  • 示例代码 :
<style>
    p{
        /*font-family: '乱七八糟的字体','微软雅黑'; *//*(备选方案用逗号隔开)*/

        font-family: 'Arial','微软雅黑';
        /*font-family: '微软雅黑','Arial';*/

        /*中文字体可以处理英文字体样式,但是英文字体无法处理中文字体样式,用备选方案即可*/
    }
</style>

文字属性的缩写

  • 示例代码 :
<style>
    p{
        /*font-style: italic;*/
        /*font-weight: bold;*/
        /*font-size: 30px;*/
        /*font-family: '楷体';*/

        /* 缩写格式,中间用空格隔开,style和weight可以省略和互换位置,size和family不可以省略,也不可以互换位置,size必须写在family的前面,否则没有任何效果 */

        font: italic bold 30px '楷体';

        /*14px代表字号 24代表行高 楷体代表字形 这是一个语法 缺一不可*/
        font:14px/24px "楷体";

        /*中文字体的别名*/
        font-family:"Microsoft YaHei";  /*微软雅黑*/
        font-family:"SimSun";   /*宋体*/

        /*缩写*/
        font:24px/44px "Times New Roman","Microsoft YaHei","SimSun";
    }
 </style>

文本属性

  • 文本装饰的属性
  • 格式:
  • text-decoration: underline;
  • 取值:
    underline:下划线
    line-through:删除线
    over-line:上划线
    none:什么都没有 最常见的用途就是删除超链接的下划线
  • 文本水平对齐的属性
  • 格式:
    text-align: center;
  • 取值:
    left/right/center
  • 文本缩进的属性
  • 格式:
  • text-indent: 2em;
  • 取值:
    em缩进两个字符

颜色的属性

  • 在CSS中如何通过color属性来修改文字颜色
  • 格式:color:值;
  • 取值:

1.英文单词(表达有限制,不是所有颜色都可以用英文来表达的)
2.rgb
三原色,r代表red,g代表green,b代表blue) rgb(0,0,0)里面的取值就是取色的比例,0-255
红色:rgb(255,0,0);
绿色:rgb(0,255,0);
蓝色:rgb(0,0,255);

黑色:rgb(0,0,0);
灰色:rgb(150,150,150);
只要让其中的取值都相同就是灰色,值越小越偏黑,值越大越偏白。企业开发中一般都用灰色的多

3.rgba
CSS3的时候推出来的,前面的rgb和上面的都是一样的,后面的a是代表透明度,最大值是1
4.十六进制
十六进制的本质就是rgb,例如:#FFEE00 FF代表r EE代表g 00代表b
十进制是0-9,逢十进一
十六进制是0-F,逢十六进一
十六进制和十进制转换的公式
用十六进制的第一位 x16 + 十六进制的第二位 = 十进制
15 == 1x16 + 5 = 21
12 == 1x16 + 2 = 18
FF == Fx16 + F = 15x16 + 15 = 240 + 15 = 255
00 == 0x16 + 0 = 0
5.十六进制缩写
在CSS中只要十六进制的颜色每两位的值都是一样的,那么就可以简写为一位
例如:#FF0000 = #F00
6.注意点:
如果当前颜色对应的数字不一样,那就不能简写,例如:#123455
如果两位相同的数字不是属于同一个颜色的,也不能简写,例如:#122334

标签选择器

  • 作用:根据指定的标签名称,在当前界面找到找有该名称的标签,然后设置属性
  • 格式:
  • 标签名称{
    属性:值;
    }
  • 注意点:

1.标签选择器选中的是当前界面中所有的标签,而不能单独选中某一个标签
2.标签选择器无论标签藏的多深,被包裹几层,都能选中
3.只要是HTML中的标签就可以作为标签选择器

  • 示例代码 :
    <style>
        p{    /* p标签 就是一个标签选择器 */
           color: red;
        }
    </style>

id选择器

  • 作用:根据指定的id名称找到对应的标签,然后给它设置属性,
  • 格式:id前面必须 + #
  • 注意点:

1.每个HTML标签都有一个属性就做id,每个标签都可以设置id
2.id是独一无二的,必须是唯一的
3.id选择器前面必须加 #
4.id的名称只能由字母/数字/下划线 (a-z,0-9,_),其他的一律不行
5.id的名称不能由数字开头
6.id名称不能是HTML标签的名称(a,img,h1...)
7.在开发中一般情况下如果只是为了设置样式,我们不会用id,因为在前端开发中id是留给js使

  • 示例代码 :
<p id="identity1">迟到毁一生</p>
<p id="identity2">早退穷三代</p>
<p id="identity3">按时上下班</p>
<p id="identity4">必成高富帅</p>
    <style>
        #identity1{
            color: red;
        }
        #identity2{
            color: blue;
        }
        #identity3{
            color: green;
        }
        #identity4{
            color: yellow;
        }
    </style>

类选择器

  • 作用:根据指定的类名称找到对应的标签,然后设置属性
  • 格式:
  • . 类名{ }
  • 注意点:

1.每个HTML标签都有一个属性就做class,每个标签都可以设置class
2.class是可以重复的
3.id选择器前面必须加 .
4.类名的命名规范和id名称的命名规范一样
5.类名就是专门用来给某个特定的标签设置样式的
6.在HTML中每一个标签可以同时绑定多个类名
7.格式:
<标签名称 class="类名1 类名2...">
<p class="类名1" class="类名2" ...></p> 错误的写法

id选择器和class选择器的区别

  • id相当于人的身份证不可以重复
  • class相当于人的名称可以重复
  • 一个HTML标签只能绑定一个id名称
  • 一个HTML标签可以绑定多个class名称
  • id选择器是以#开头
  • class选择器是以.开头
  • 开发中到底用id选择器和class选择器呢

1.id一般情况下是给js使用的,所以除非是特殊情况,否则不要使用id去设置样式
2.在企业开发中一个开发人员对类的使用可以看出这个开发人员的技术水平
3.一般情况在企业开发中要注重冗余代码的抽取,可以将一些公共的代码抽取到一个类选择器中,然后让标签和这个类 选择器绑定即可

后代选择器

  • 找到指定标签的所有后代标签,设置属性
  • 格式:
    标签名称1 标签名称2{
    属性:值;
    }
  • 先找到名称叫做标签1的标签,然后再在这个标签下面查找所有名称叫做标签2的标签,然后设置属性
  • 注意点:

1.后代选择器必须用空格隔开
2.后代选择器不仅仅是儿子,也包括孙子/重孙子,只要最终是放到指定标签中的都是后代
3.后代选择器不仅仅可以使用标签的名称,还可以选择其他的选择器**

子元素选择器

  • 作用:找到指定标签中所有特定的直接资源色,然后设置属性
  • 格式:
    标签名称1>标签名称2{
    属性:值;
    }
  • 注意点:

1.子元素选择器只会查找儿子,不会查找其他的元素
2.子元素选择器之间需要用>符号链接 不能有空格
3.子元素选择器不仅仅可以使用标签的名称,还可以选择其他的选择器
4.子元素选择器可以通过>符号一直延续下去

  • 示例代码 :
<p>我是段落</p>
<div id="identity">
    <p>我是段落</p>
    <p>我是段落</p>
    <ul>
        <li>
            <p>我是段落</p>
        </li>
    </ul>
</div>
<p>我是段落</p>
    <style>
        /*
        div>p{
            color: red;
        }
        */
        /*
        #identity>p{
            color: red;
        }
        */
        div>ul>li>p{
            color: red;
        }
    </style>

后代选择器和子元素选择器

区别

  • 后代选择器使用空格作为连接符号
  • 子元素选择器使用>作为连接符号
  • 后代选择器会选中指点标签中所有的特定后代标签 也就是会选中儿子/孙子... 只要被放到指定标签中的特定标签都会被选中
  • 子元素选择器智慧选中指定标签中所有的特定直接标签 也就是只会选中- 特定的儿子标签

共同点

  • 后代选择器和子元素选择器都可以使用标签名称/id名称/class名称来作为选择器
  • 后代选择器和子元素选择器都可以通过各自的连接符号一直延续下去
  • 开发中如何选择
    1.如果想选中指定标签中所有特定的标签 那么就使用后代选择器
    2.如果纸箱选中指定标签中的所有特定的儿子标签 那么就使用子元素选择器

交集选择器

  • 作用:给所有选择器选中的标签中相交的那部分标签设置属性
  • 格式:
    选择器1选择器2{
    属性:值;
    }
  • 注意点:

1.选择器和选择器之间没有任何的连接符号
2.选择器可以使用标签名称/id名称/class名称
3.只做了解 开发中很少用到

  • 示例代码 :
<p class="para1" id="identity">我是段落</p>
<p class="para1">我是段落</p>
p.para1#identity{    color: red;}

并集选择器

  • 作用:给所有选择器选中的标签设置属性
  • 格式:
    选择器1,选择器2{
    属性:值;
    }
  • 注意点:

1.并集选择器必须用,隔开
2.选择器可以使用标签名称/id名称/class名称

  • 示例代码 :
<h1 class="ht">我是标题</h1>
<p class="para">我是段落</p>
    <style>
        /*
        .ht{
            color: red;
        }
        .para{
            color: red;
        }
        */
        .ht,.para{
            color:blue;
        }
    </style>

兄弟选择器

相邻兄弟选择器 CSS2

  • 作用:给指定选择器后面紧跟的那个选择器选中的标签设置属性
  • 格式:
    选择器1+选择器2{
    属性:值;
    }
  • 注意点:

1.相邻兄弟选择器之间必须用+连接起来
2.相邻兄弟选择器只能选择紧跟其后的那个标签 不能选中被隔开的标签

通用兄弟选择器=

  • 作用:给指定选择器后面的所有选择器选中的所有标签设置属性
  • 格式:
    选择器1~选择器2{
    属性:值;
    }
  • 注意点:
    1.通过兄弟选择器必须用~隔开
    2.通用兄弟选择器选中的是指定选择器后面某个选择器中所有的标签 不管中间有没有被其他标签隔开
  • 示例代码 :
<h1 class="ht">我是标题</h1>
<p>我是段落</p>
<p>我是段落</p>
<p>我是段落</p>
<p>我是段落</p>
<h1>我是标题</h1>
<p>我是段落</p>
<p>我是段落</p>
<p>我是段落</p>
<p>我是段落</p>
    <style>
        /*
        .ht+p{
            color: red;
        }
        */
        h1~p{
            color: blue;
        }
    </style>

序选择器

CSS3中新增的选择器最具代表的就是序选择器

同级别中的第几个

  • :first-child 选中同级别中的第一个标签
  • :last-child 选中同级别中的最后一个标签
  • nth-child(n) 选中同级别中的第n个标签
  • :nth-last-child(n) 选中同级别中的倒数第n个标签
  • :only-child 选中父元素中唯一的这个元素
  • 注意点:这几个都不区分类型

同级别同类型中的第几个

  • :first-of-type 选中同级别中同类型的第一个标签
  • :last-of-type 选中同级别中同类型的最后一个标签
  • :nth-of-type(n) 选中同级别中同类型的第n个一个标签
  • :nth-last-of-type(n) 选中同级别中同类型的倒数第n个标签
  • :only-of-type 选中父元素唯一类型的某个标签
  • :nth-child(odd) 选中同级别中的所有奇数
  • :nth-child(even) 选中同级别中的所有偶数
  • :nth-child(xn+y)
  • x和y是用户自定义的 而n是一个计数器 从0开始递增
  • 示例代码 :
    <style>
        p:first-child{
            color: red;
        }
        p:first-of-type{
            color: blue;
        }
        p:last-child{
            color: red;
        }
        p:last-of-type{
            color: blue;
        }
        p:nth-child(3){
            color: green;
        }
        p:nth-of-type(3){
            color: red;
        }
        p:nth-last-child(2){
            color: red;
        }
        p:nth-last-of-type(2){
            color: red;
        }
        p:only-child{
            color: purple;
        }
        p:only-of-type{
            color: red;
        }
        p:nth-child(odd){
            color: red;
        }
        p:nth-child(even){
            color: blue;
        }
        p:nth-of-type(odd){
            color: red;
        }
        p:nth-of-type(even){
            color: blue;
        }
        p:nth-child(2n+0){
            color: red;
        }
        p:nth-child(3n+0){
            color: red;
        }
    </style>

属性选择器

  • 作用:根据指定的属性名称找到对应的标签设置属性
  • 格式:
    [attribute=value]
    1.作用:找到有指定属性 并且属性的取值等于value的标签 然后设置属性
    2.最常见的场景就是区分input属性
  • 示例代码 :
input[type=password]{}
<input type="text" name="" id="">
<input type="password" name="" id="">
<input type="checkbox" name="" id="">
<input type="radio" name="" id="">
  • 示例代码 :
<p id="identity1">我是段落1</p>
<p id="identity2" class="cc">我是段落2</p>
<p class="cc">我是段落3</p>
<p id="identity3" class="para">我是段落4</p>
<p>我是段落5</p>
    <style>
        /*
        p[id]{
            color: red;
        }
        */
        p[class=cc]{
            color: blue;
        }
    </style>

属性选择器2

属性取值是以什么开头的

  • [attribute^=value] CSS3
  • [attribute|=value] CSS2
  • 区别:

1.CSS2中的只能找到value开头 value是被-和其他内容隔开的
2.CSS中只要是以value开头的都可以找到,无论它是不是被隔开
3.属性的取值是以什么结尾的
[attribute$=value] CSS3
4.属性的取值是否包含某个特定的值
[attribute~=value] CSS2
[attribute
=value] CSS3
*

  • 示例代码 :
<img src="" alt="abcwwwmmm">
<img src="" alt="wwwmmmabc">
<img src="" alt="wwwabcmmm">
<img src="" alt="def abc">
<img src="" alt="ppp abc">
    <style>
        /*
        img[alt^=abc]{
            color: red;
        }
        */
        /*
        img[alt|=abc]{
            color: red;
        }
        img[alt$=abc]{
            color: blue;
        }
        */
        img[alt*=abc]{
            color: red;
        }
    </style>

通配符选择器

  • 由于通配符选择器是设置界面上所有的标签属性 所以在设置之前会遍历所有的标签 如果当前界面的标签比较多 那么性能就会比较差 所以在企业开发中一般不会使用通配符选择器
  • 示例代码 :
    <style>
        /* 不推荐使用 */
        *{
            margin:0;
            padding:0;
        }
    </style>

CSS三大特性之继承性

什么是继承性

  • 作用:给父元素设置的属性 他的子元素也可以使用
  • 注意点:

** 1.并不是所有的属性都可以继承 只有以color/font-/text-/line开头的属性才可以继承
2.在CSS的继承中 不仅仅是儿子可以继承 只要是后代 都可以继承
3.CSS继承性中的特殊性
a标签的文字颜色和下划线是不能继承的
h标签的文字大小是不能继承的**

  • 应用场景:
    一般用于设置网页上的一些共性信息 例如网页的文字颜色 字体 字体大小等内容 body{}
  • 示例代码 :
<div>
    <p>我是段落</p>
</div>
<div>
    <ul>
        <li>
            <p>我是段落</p>
        </li>
    </ul>
</div>
<div>
    <a href="#">我是超链接</a>
</div>
<div>
    <h1>我是大标题</h1>
</div>
    <style>
        div{
            color:red;
            font-size: 30px;
        }
    </style>

CSS三大特性之层叠性

什么是层叠性

  • 作用:层叠性就是CSS处理冲突的一种能力
  • 注意点:
    层叠性只有在多个选择器选中"同一个标签" 然后又设置了"相同的属性" 才会发生层叠性
  • CSS全称 Cascading StyleSheet
  • 示例代码 :
<p id="identity" class="para">我是段落</p>
    <style>
        p{
            color: red;
        }
        .para{
            color: blue;
        }
    </style>

CSS三大特性之优先级

什么是优先级

  • 作用:当多个选择器选中同一个标签 并且给同一个标签设置相同属性时 如何层叠就由优先级来确定
  • 优先级判断的三种方式

1.是否是直接选中(间接选中就是继承) 遵循就近原则 谁离的近 就层叠谁的样式
2.相同的选择器 如果都是直接选中 都是同类型的选择器 谁写在后面就层叠谁的样式
3.不同的选择器 如果都是直接选中 但是是不同类型的选择器
id>类>标签>通配符>继承>浏览器默认

  • 示例代码 :
<ul>
    <lu>
        <li>
            <p id="identity" class="para">我是段落</p>
        </li>
    </lu>
</ul>
    <style>
        p{}
        #identity{}
        .para{}
        ul{
            color: red;
        }
        li{
            color: blue;
        }
    </style>

优先级之 important

  • 作用:用于提升某个标签直接选中标签的选择器的某个属性的优先级的 可以将被指定的属性的优先级提升为最高
  • 注意点:
    1.important只能用于直接选中 不能用与间接选中
    2.通配符选择器选中的标签也是直接选中的
    3.!important只能提升被指定的属性的优先级 其他属性的优先级不会被提升
    4.!important必须写在属性值的后面 感叹号不能省略 必须写在分号里面
  • 示例代码 :
<ul>
    <lu>
        <li>
            <p id="identity" class="para">我是段落</p>
        </li>
    </lu>
</ul>
    <style>
        #identity{
            color: red;
        }
        p{
            color: deepskyblue ;
        }
        li{
            color: blue !important; (间接选中的无效)
        }
    </style>

优先级之权重问题

  • 作用:当多个选择器混合在一起使用时 我们可以通过计算权重来判断谁的优先级最高

权重的计算规则

  • 首选计算选择器中谁的id最多
  • 如果id的个数一样 那么再看类名的个数 类名个数多的优先级别高
  • 如果类名的个数一样 那么再看标签名的个数 标签名个数多的优先级别高
  • 如果id/类名/标签名的个数都一样 那么谁写在最后面就层叠谁的样式
  • 注意点:
    只有选择器是直接选中标签的 才需要计算权重
  • 示例代码 :
<div id="identity" class="box1">
    <ul>
        <li>
            <p id="identity1" class="box2">我是段落</p>
        </li>
    </ul>
</div>
    <style>
        #identity1.box2{
            color: red;
        }
        .box1 .box2{
            color: aqua;
        }
        div ul li p{
            color: blue;
        }
    </style>

div和span标签

div

  • 作用:配合CSS完成网页的基本布局

span

  • 作用:一般配合CSS修改网页中的局部信息

div和span有什么区别

  • div会独占一行 而span不会独占一行
  • div是一个容器级别的标签 而span是文本级别的标签
  • 容器级的标签和文本级的标签的区别

容器级的标签

  • 容器级的标签中可以嵌套其他所有的标签
  • 文本级的标签中只可以嵌套文字/超链接/图片
  • 容器级的标签
    例如:div h ul ol dl li ...
  • 文本级的标签
    例如:span p buis strong em ins del...
  • 注意点:
    那些标签是文本级的 那些标签是容器级的 不用可以记忆 在企业开发中要嵌套都是嵌套在div中

CSS元素的显示模式

  • 在HTML中将所有的标签分为两类 分别是容器级标签和文本级标签
  • 在CSS中也将所有的标签分为两类 分别是块级标签和行内标签

块级标签 特点:独占一行

  • 所有的容器级标签都是块级标签
    例如:p div h ul ol dl li ...

行内标签 特点:不会独占一行

  • 所有文本级的标签都是行内标签 除p标签以外
    例如:span b u i s strong em ins del...

块级标签和行内标签的区别

  • 块级标签

1.独占一行
2.如果没有设置宽度 默认和父元素一样宽高
3.如果设置了宽高 那就按照设置的来显示

  • 行内标签

1.不会独占一行
2.如果没有设置宽度 默认和字体宽度一样
3.行内标签是不可以设置宽度和高度**

  • 行内块级标签
    为了能够让标签既能够不独占一行 又可以设置宽度和高度 就出现了行内块级标签
  • 示例代码 :
<div>我是div</div>
<p>我是段落</p>
<h1>我是标题</h1>
<hr>
<span>我是span</span>
<b>我是加粗</b>
<strong>我是强调</strong>
<hr>
![](images/picture.jpg)
![](images/picture.jpg)
<style>
        div{
            background-color: red;
            width: 200px;
            height: 100px;

        }
        img{
            width: 50px;
            height: 50px;
        }
</style>
**显示模式**

CSS显示模式转换

  • 转换CSS中元素的显示模式
  • 通过display属性来转换
  • display取值:

inline ----- > 行内
block ------ > 块级
inline-block -----> 行内块级

  • 示例代码 :
<div>我是div</div>
<div>我是div</div>
<span>我是span</span>
<span>我是span</span>
<p class="cc">我是段落</p>
<b class="cc">我是加粗</b>
    <style>
        div{
            display: inline;
            background: red;
            width: 200px;
            height: 200px;
        }
        span{
            display: block;
            width: 200px;
            height: 200px;
            background: green;
        }
        .cc{
            background: blue;
            width: 200px;
            height: 200px;
            display: inline-block;
            /*
            快捷键
            di display: inline;
            db display: block;
            dib display: inline-block;
          */
        }
    </style>

书山有路勤为径 学海无涯苦作舟

更多精彩内容 请点击跳转

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 196,099评论 5 462
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 82,473评论 2 373
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 143,229评论 0 325
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,570评论 1 267
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,427评论 5 358
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,335评论 1 273
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,737评论 3 386
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,392评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,693评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,730评论 2 312
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,512评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,349评论 3 314
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,750评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,017评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,290评论 1 251
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,706评论 2 342
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,904评论 2 335

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,517评论 18 139
  • 国家电网公司企业标准(Q/GDW)- 面向对象的用电信息数据交换协议 - 报批稿:20170802 前言: 排版 ...
    庭说阅读 10,808评论 6 13
  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,210评论 1 41
  • 老父亲今年七月就满七十了。可是,一生清高自强的父亲依然种田兼打工。每天,5点半,父亲便坐在床上边抽烟边咳嗽,...
    关晾宝儿阅读 161评论 0 0
  • 青山春雨细无声。最恐离别步履匆。 不知少年何时还?相逢无期心空空。
    Angelatianyu阅读 156评论 0 2