微博代码（2）

摘要： <style type="text/css"> .header { height: 250px; width: 900px; border: 1px solid black; margin: 0px auto; padding:

		<style type="text/css">
			.header {
				height: 250px;
				width: 900px;
				border: 1px solid black;
				margin: 0px auto;
				padding: 10px;
			}

			img {
				width: 290px;
				height: 50px;
				float: left;
			}

			.header_sr {
				height: 50px;
				width: 100px;
				float: right;
				line-height: 50px;
			}

			#text {
				height: 150px;
				width: 850px;
				margin-left: 20px;
				border: 3px solid #CCCCCC;
				margin-top: 5px;
			}

			.header #sp1,
			#sp2,
			#sp3,
			#sp4,
			#sp5,
			#sp6 {
				float: left;
				width: 50px;
				height: 30px;
				line-height: 30px;
				padding-left: 20px;
			}

			.header #sp1 {
				background: url(img/bq.png) no-repeat left center;
			}

			.header #sp2 {
				background: url(img/tp.png) no-repeat left center;
			}

			.header #sp3 {
				background: url(img/sp.png) no-repeat left center;
			}

			.header #sp4 {
				background: url(img/ht.png) no-repeat left center;
			}

			.header #sp5 {
				background: url(img/tt.png) no-repeat left center;
			}

			.header #sp6 {
				margin-left: 300px;
				height: 30px;
				width: 500;
			}

			#bt {
				float: right;
				margin: 0px 10px;
				height: 30px;
				width: 100px;
				background: #FF8140;
				border: none;
				color: #FFFFFF;
				border-radius: 70px;
			}
		</style>

	<div class="header">
			<img src="img/logo.png">
			<div class="header_sr">已输入<span id="number"></span>字</div>
			<textarea id="text"></textarea>
			<span id="sp1">表情</span>
			<span id="sp2">图片</span>
			<span id="sp3">视频</span>
			<span id="sp4">话题</span>
			<span id="sp5">头条</span>
			<span id="sp6">公开</span>
			<input type="button" value="发布" id="bt" />
		</div>

<script type="text/javascript">
		window.onload=function(){
			var number,text,m
			number=document.getElementById('number');
			text=document.getElementById('text');
			bt=document.getElementById('bt');
			text.onkeyup=function a(){
				m=text.value.length;
				number.innerHTML=m;
				if(m>140){
					number.style.color="red"
				}else(
				number.style.color="black"
				);
			};
			bt.onclick=function(){
				if(m>140){
					alert('字数太多，无法发布');
				}else if (m<5){
					alert('字数太少了，多写点吧')
				}else{
					alert('发布成功');
				}
		}
		}
	</script>

批改老师：韦小宝批改时间：2018-12-25 09:27:44
老师总结：这里主要就是开始js代码来完成实际的小功能了！还是挺有意思的！