table+css与xhtmL+css实现同一登陆框(代码片段)
1、从网上下载了一个不错的登录框样式(table结合css布局);
2、初学xhtmL,自己改写了一下,希望有用
3. 我怎么不会上传截图呢?
1. [代码]xhtml_css组合
<!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=gb2312" />
<title>form表单—xhtml_css表示</title>
<style type="text/css">
body,h2,h3,p,img,dl,dd,ul, ol,li{margin:0;padding:0;border:none;font-size:12px;color:#666}
body{margin:0 auto;font-family: verdana, tahoma, sans-serif;}
ul,ol,li{ list-style:none}
a{text-decoration:none; color:#666}
a:hover{ color:#F60; }
.login { width:180px; padding:15px 10px;}
.login fieldset{ border:0; margin:0px; padding:0px;}
.login legend{ display:none}
.login_title,.login_item,.login_footer{ margin-top:8px;}
.login_title p,.login_item .input_user,.login_item .input_pwd,.login_footer .login_btn{ margin-top:6px;}
.login_title h3{ height:20px; padding-top:5px; font-size:10px;font-weight:bold; background-color:#F4F4F4}
.login_title img{ width:16px; height:16px; }
.login_title p{ font-size:12px;color:#666666}
.login_item label{ display:block;}
.login_item input{background:#FFFFFF;border:1px solid #CCCCCC;color:#000000;font-size:0.95em;}
.login_item .input_user{background-image:url(images/username.gif);background-position:1px 1px;background-repeat:no-repeat;padding-left:20px;height:20px;FONT-SIZE:12px;}
.login_item .input_pwd{background-image:url(images/password.gif);background-position:1px 1px;background-repeat:no-repeat;padding-left:20px;height:20px;FONT-SIZE:12px;}
.login_footer p{font-size:10px;color:#F60}
.login_footer .login_btn{width:85px;}
</style>
</head>
<body>
<div class="login">
<form id="" name="" action="" method="post">
<fieldset>http://www.huiyi8.com/gongzuozongjie/
<legend>登陆</legend>
<div class="login_title">
<h3><b>+用户登录</b></h3>
<P><img src="data:images/warning.gif" align="absmiddle">请输入登陆的用户和密码</P>
</div>工作总结
<div class="login_item">
<label for="form_user">用户名:</label>
<input type="text" class="input_user" name="form_user" id="form_user" value="" tabindex="1" />
</div>
<div class="login_item">
<label for="form_pwd">密 码:</label>
<input type="text" class="input_pwd" name="form_pwd" id="form_pwd" value="" tabindex="2" />
</div>
<div class="login_footer">
<p>忘记密码?</p>
<input type="submit" class="login_btn" value="登 录" tabindex="3" />
</div>
</fieldset>
</form>
</div>
</body>
</html>
table+css与xhtmL+css实现同一登陆框(代码片段)的更多相关文章
- div+css 和 xhtml+css是一回事么?
div+css 和 xhtml+css是一回事.只是说法不一样,表达得意思都是通过CSS定义DIV 布局. 那为什么地方要说成XHTML +css 呢? 以为我们做网站用CSS布局得时候不光是用了DI ...
- 关于DIV+CSS和XHTML+CSS的理解
WEB标准是一系列标准的集合,并不是仅“DIV+CSS”布局就可以实现.以CSS网页布局只是标准的基础之一.“DIV+CSS”布局只是一种通俗的称呼罢了.而我们学习的目标在于以XHTML建立良好的语义 ...
- 拥有的50个CSS代码片段(上)
1. CSS 重置 ;;;font-size: 100%; font: inherit; vertical-align: baseline; outline: none; -webkit-box-si ...
- (转)每位设计师都应该拥有的50个CSS代码片段
原文地址:http://www.cnblogs.com/fengyuqing/archive/2013/06/15/css_50.html 面对每年如此多的 新趋势 ,保持行业的领先是个很困难问题. ...
- 很实用的50个CSS代码片段
原文:50 Useful CSS Snippets Every Designer Should Have 面对每年如此多的 新趋势 ,保持行业的率先是个非常困难问题. 站点设计者和前 ...
- 3行3列表格 table实现,div+css实现
table实现: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww ...
- (转)第一天 XHTML CSS基础知识 文章出处:标准之路(http://www.aa25.cn/div_css/902.shtml)
欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还是称之为web标准. 学习本系列教程需有一定html和css基础,也 ...
- XHTML CSS 常见问题和解决方案
原文地址:XHTML CSS 常见问题和解决方案 作为前端开发人员,在日常的页面制作时,不可避免的会碰上这样那样的问题,我挑选了其中的一些进行总结归档,希望对大家会有所帮助: 1.如何定义高度很小的容 ...
- Web标准:一、xhtml css基础知识
说明:这些知识是我看<十天学会DIV+CSS教程完整版 完美整理+完整代码>这篇文章后记下来的一些内容,包括少部分不懂得地方去百度到的一些解释等,该文章的地址: http://wenku. ...
随机推荐
- java 十进制转十六进制、十进制转二进制、二进制转十进制、二进制转十六进制
//10进制转16进制 Integer.toHexString(20); //10进制转2进制 Integer.toBinaryString(10); //16进制转10进制 Integer.pars ...
- iOS开发---业务逻辑
iOS开发---业务逻辑 1. 业务逻辑 iOS的app开发的最终目的是要让用户使用, 用户使用app完成自己的事就是业务逻辑, 业务逻辑的是最显眼开发工作.但是业务逻辑对于开发任务来说, 只是露 ...
- PHPstorm如何安装vue.js插件
1.什么是PHPstorm? PhpStorm是一个轻量级且便捷的PHP IDE,其旨在提高用户效率,可深刻理解用户的编码,提供智能代码补全,快速导航以及即时错误检查.----来自百度百科 一句话:P ...
- 使用Swoole加速Laravel(正式环境中)
1 Laravel的速度瓶颈在哪? 1.1 已有的一些优化方法 1.1.1 laravel官方提供了一些优化laravel的优化方法 php artisan optimize php artisan ...
- markdown流程图语法
从网上找了非常久关于markdown语法的文章.机会微乎其微.大多所指向的都是同一个页面https://github.com/adrai/flowchart.js 这是github上的一个开源项目,里 ...
- linux下jdk多版本管理
linux下jdk多版本管理 项目开发中,不管是哪种语言都避免不了多个版本环境管理问题(本文虽然以jdk为例来写的,但不仅限于jdk),如何能做到快速的环境升级与切换确实是一件深思的事! 安装jdk ...
- Netty实现java多线程Post请求解析(Map参数类型)—SKY
netty解析Post的键值对 解析时必须加上一个方法,ch.pipeline().addLast(new HttpObjectAggregator(2048)); 放在自己的Handel前面. ht ...
- Eclipse 中svn的合并与同步
Eclipse 中svn的合并与同步: 1. 从主干拉取到分支: 然后一直下一步,到完成就OK了. 2. 从分支代码合并到主干: 2.1.先将本地需要提交更新的代码提交更新到svn分支去 2.2. ...
- Js格式化json字符串
var formatJson = function(json, options) { var reg = null, formatted = '', pad = 0, PADDING = ' '; / ...
- 使用Imagemagick批量加水印缩小图片的脚本
安装Imagemagick首先要安装Imagemagick 本文HTML永久地址 doc CentOS上安装 yum install ImageMagick -yDebian上安装 apt-get i ...