在一个div里面嵌套1个labal和2个div,如何用css实现:labal和第一个div显示在一行,第2个div显示在第2行,并且和第1个div左对齐?_html/css_WEB-ITnose

WBOY
发布: 2016-06-21 09:30:20
原创
1433 人浏览过
在一个div里面嵌套1个labal和2个div,如何用css实现下面的效果:labal和第一个div显示在一行,第2个div显示在第2行,并且第2个div和第1个div左对齐?

html代码如下:

                            

                                
                                

                                    
                                
  
                                

                                    

                                        用户姓名不能为空
                                    

                                

                            




回复讨论(解决方案)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style>.cf:after{content:'';display:block;clear:both;}.cf{zoom:1;}.big{width:300px;}.cLabel{float:left; width:100px;height:30px;line-heihgt:30px;text-align:right;}.cInput{float:left; width:200px;height:30px;line-height:30px;text-align:left;}.cTip{float:left;padding-left:100px;}</style></head><body><div class="big cf" >    <label class="cLabel">        用户名:    </label>    <div class="cInput" >        <input type="text" class="f-text" id="txtLogin" name="xlInput" value=""/>    </div>      <div class="cTip" >        <div id="divLoginTip">            <span style="  color: red;  font-size: 14px;">用户姓名不能为空</span>        </div>    </div>    <label class="cLabel">        密码:    </label>    <div class="cInput" >        <input type="text" class="f-text" id="txtLogin" name="xlInput" value=""/>    </div>      <div class="cTip" >        <div id="divLoginTip">            <span style="  color: red;  font-size: 14px;">密码不能为空</span>        </div>    </div></div></body></html>
登录后复制

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板