星空网 > 软件开发 > 网页设计

css笔记——inline

 

 

html

<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 	<title>无标题</title>	<link rel="stylesheet" type="text/css" href="css/whiteSpace.css"></head><body>	<div >		<div >						<span>								2223333333333333333333333333333333333333333333333333333333333333333333333333333333333			</span>		</div>		<div >			<span>222222222222222222222222222222222</span>		</div>	</div>	<div ></div>	<div >		<div >						123		</div>		<div >						456		</div>	</div></body></html>

css

/**空白字符*/body{	margin:0;	padding:0;}/*行内元素*/.right , .left{	margin:0;	padding:0;	display: inline-block;	width:50%;	height: 100px;	word-break:break-all;	word-wrap:break-word;	white-space:normal;	line-height:0;	font-size:15px;	vertical-align:text-top;	}.left{	background-color: #428bca;}.left span ,.right span{	line-height:1.28;}.right{	background-color:#F00;}.container{	width:100%;	/*white-space: nowrap;*/	font-size:0;}/*.left span{	white-space:pre-line;}*//*浮动元素*/.main{	width:100%;	margin:100px 0;	padding:0;	height:100px;}.myLft,.myRgt{	float:left;	width:50%;	height:100px;}.myLft{	background-color:#428bca;}.myRgt{	background-color:#f00;}.main:before,.main:after{	display:table;	height:0;	content:'';	clear:both;}

 

效果图

css笔记——inline  

 




原标题:css笔记——inline

关键词:CSS

CSS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

中维质检:https://www.goluckyvip.com/tag/49390.html
中文出海:https://www.goluckyvip.com/tag/49391.html
中文教育:https://www.goluckyvip.com/tag/49392.html
中西海外仓:https://www.goluckyvip.com/tag/49393.html
中新时代国际货运代理:https://www.goluckyvip.com/tag/49398.html
中信跨境电商学院:https://www.goluckyvip.com/tag/49399.html
想要搞钱,就去做离搞钱最近的事:https://www.kjdsnews.com/a/1836533.html
ToB销售,解决方案必须让客户听完就想下单:https://www.kjdsnews.com/a/1836534.html
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流