手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >CSS实战:用dl、dd、dt做一个网页表单
CSS实战:用dl、dd、dt做一个网页表单
摘要:XHTML部分:公司名称:*公司工业类别:计算机和消费电子空气调节器*公司介绍:广州骏宝实业有限公司创始于1990年,是集科研、制造、销售、...

XHTML部分:

<dl>
 <dt>公司名称:</dt>
 <dd><input name="text" type="text" value="广州骏宝实业有限公司" size="50" /> <span class="red">*</span></dd>
 <dt>公司工业类别:</dt>
 <dd><select name="select"><option>计算机和消费电子 </option></select>
 <select name="select"><option>空气调节器</option></select> <span class="red">*</span></dd>
 <dt>公司介绍:</dt>
 <dd><textarea name="textarea" cols="100" rows="9">广州骏宝实业有限公司创始于1990年,是集科研、制造、销售、服务于一体,拥有研究开发中心、模具设计制造中心、电子和电路控制设计制造中心、注塑加工和产品整机生产基地的规模化经济实体。骏宝公司生产基地约占地 30000平方米,拥有精良的设备,强大的生产能力。公司按照现代化企业的规范组织和管理,坚持诚信、创新、勤奋、进取的企业精神,不断发展壮大。
骏宝公司人才荟萃,现有职工326人,拥有研发 ... </textarea> <span class="red">*</span>
 </dd>
</dl>

CSS部分:

dl{padding-left:14px;}
dt{float:left;font-weight:bold;padding:12px 0 4px;}
dd{ text-align:left;height:auto;padding:8px 0;}
input,select{ vertical-align:middle;color:#333333; background: #ffffff; font:12px Arial, Helvetica, sans-serif;}
textarea{color:#333333; background: #ffffff; font:12px Arial, Helvetica, sans-serif;line-height:150%;overflow: auto}

说明:对于dl、dt、dd的设置建议不要用高度(height)和行高(line-height),在FF会产生错位,由于IE和FF是否自适应造成,建议使用dt、dd的padding属性来定位!


 

【CSS实战:用dl、dd、dt做一个网页表单】相关文章:

Div+CSS网页制作误区

CSS实例教程:十步学会用CSS建站

CSS+DIV制作网页时易犯的错误总结

纯CSS实现漂亮tab选项卡切换特效

怎样用CSS实现大背景网页效果

CSS设计网页头部的写法

DIV+CSS制作的网页如何让网页居中

CSS+图片完成清爽绿色网站下拉菜单

用CSS实现表单form布局

CSS3动画帧数科学计算法

精品推荐
分类导航