HTML-聊天-信息（内容）框，编写

HTML-聊天-信息（内容）框，编写

成品展示

1.html代码

<div class="allChat">
	<ul class="right">
		<li>
			<span class="content">
				陕西省交界处学史力行什么啊
				心理学陕西省交界处学史力行
				界处学史力行什么心理学陕西
				学史力行什么心理学莫西莫西
			</span>
		</li>
	</ul>
</div>

2.css代码

.right{
	float: right;
}
.allChat{
    width: 400px;
    height: 600px;
    border: 1px solid red;
}

li{
    margin-top: 10px;
    margin-right: 20px;
    list-style: none;
    background-color: #ffffff;
    border: 1px solid #ccc;
    box-shadow: 0 0 3px #ccc;
    border-radius: 5%;
}
span{
    font-size: 15px;
    margin: 10px;
    max-width: 250px;
    display: inline-block;
}