css气泡式聊天框边框问题

html-css014

css气泡式聊天框边框问题,第1张

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html charset=UTF-8">

        <title>无标题文档</title>

        <style type="text/css">

            body,html{

             margin:0px

             height:100%

            }

            .autoHeight{

             width:100px

             height:100%

             background:red

            }

</style>

<style type="text/css">

 div{ background: #FFF

font-family: "微软雅黑"

top: 10%

position: absolute

left: 50%

display: inline-block

padding: 10px

border-radius: 10px

box-shadow: 1px 1px 3px rgba(0,0,0,0.2)}

  div:before {

left: -10px

top: 50%

margin-top: -6px

position: absolute

z-index: -1

content: ""

width: 0

height: 0

border-top: 8px solid transparent

border-bottom: 8px solid transparent

border-right: 11px solid rgba(0, 0, 0, 0.1)

border-left: 0

}

div:after {

left: -11px

top: 50%

margin-top: -8px

position: absolute

content: ""

width: 0

height: 0

border-top: 8px solid transparent

border-bottom: 8px solid transparent

border-right: 11px solid #FFF

border-left: 0

}</style></head>

<body style="

    background: #369

">

  <div>你好</div>

</body>

</html>

根据你的图做的,应该合适了。

PS

之类的吧,也有的是作者自己画的

PS之类的工具可以做比较复杂的表情,比如GIF啊什么的

我自己平时斗图什么的直接用表情广场DIY做图,有一些固定模板可以选择,自己填个字改个颜色和大小什么的,很快

希望对你有帮助

会有风暴晃动屏幕。

1、首先打开微信,选择一个聊天框。

2、其次在复制“亚索,听我口令”,发送到微信群里或个人聊天框里,会有风暴晃动屏幕。

3、最后会吹所有人的手机屏幕,在屏幕出现亚索动画。