HTML CSS 个人注册界面实现边框上加文字

实例:制作个人注册界面

效果:

HTML 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=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>个人注册</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<style>body{background-image:url("images/bg03.jpg");background-repeat:no-repeat;background-size:600px 400px;}.css1{ font-family:"微软雅黑";font-size:17px;color:#FFF;}.css2{ width:300px;height:100px;line-height:37px;border-color:#FFF;border-width:thin;margin:30px 4px 30px 40px;padding:0px 5px;}.css3{ position:absolute;left:240px;top:350px;}fieldset{padding:75px 20px 40px 40px;margin:20px 20px 5px 10px;}table {width: 400px;border-collapse: separate;border-spacing: 24px;}
</style>
</head>
<body>
<div class="css2"><fieldset ><legend><span class="css1">个人注册</span></legend><table><tr><td><span class="css1"> 用户名称：</span><input/></td></tr><tr><td><span class="css1"> 密码：</span><input /></td></tr></table></fieldset><img class="css3"src="data:images/btn.jpg" />
</div>
</body>
</html>

图片自取

小结:

这个实例主要就是调节padding和margin的参数.没啥技术含量了其实,上网查了如何边框上加文字,主要方法有两个:一个是;还有就是JavaScrip(没学,不会写)
我用了表格来排版,然后用了background-image来插入图片.

HTML CSS 个人注册界面实现边框上加文字相关推荐

html在边框上加文字
<html> <body> <form> <fieldset> <legend>在边框上的字</legend> 可以输入内容:& ...
PHP 合成图片并在图片上加文字
/*** Info: PHP把一张图片作为背景和另一张图片合成新图片*/public function createImage(){$path_1 = 'XXXXX/attachment/images ...
HTML+CSS登录注册界面
目录一.效果演示二.代码实现 2.1.HTML主页面 2.2.CSS代码 2.3.JS代码一.效果演示 [注]: 这里需要我们创建三个文件,一个是index.html文件,一个是style.cs ...
CSS实现背景透明而背景上的文字不透明
在我们设计制作一些网页的时候可能会用到半透明的效果,首先我们可能会想到用PNG图片处理,当然这是一个不错的办法,唯一的兼容性问题就是ie6 下的BUG,但这也不困难,加上一段js处理就行了.但假如我们 ...
CSS盒子模型、圆角边框、盒子/文字阴影
目录 CSS盒子模型网页布局过程: 盒子模型(Box Model)组成边框(border) 表格的细线边框边框会影响盒子实际大小内边距(padding) padding应用-新浪导航编辑 ...
条码软件中如何在边框上添加文字
很多用户在使用条码标签软件设计制作标签时,会有自己的一些个性化的需要,虽然条码软件不能和作图软件相比,但是很多效果还是可以通过一些小技巧来实现的.比如下面要给大家介绍的把文字压在边框上的效果.如下图所 ...
Python 给图片上加文字
import PIL from PIL import ImageFont import PIL from PIL import ImageFont from PIL import Image from ...
php 图片上加文字,php使用GD库实现图片上添加文字的方法（代码）
本篇文章给大家带来的内容是关于php使用GD库实现图片上添加文字的方法(代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 我们可以利用php的gd库扩展来对我们的图片进行处理,例 ...
CSS实现背景透明而背景上的文字图片不透明
1.用图片则能兼容IE8和IE7 2.用颜色则不能兼容IE8和IE7,并且颜色层不能随着内容层自增长,只能设置一个固定高度 3.用颜色则颜色层不能包含内容层(图片和文字) 1 <!-- wrap ...

HTML CSS 个人注册界面实现边框上加文字

实例:制作个人注册界面

效果:

HTML CSS 代码实现:

图片自取

小结:

HTML CSS 个人注册界面实现边框上加文字相关推荐

最新文章

热门文章

HTML CSS 个人注册界面 实现边框上加文字

实例:制作个人注册界面

效果:

HTML CSS 代码实现:

图片自取

小结:

HTML CSS 个人注册界面 实现边框上加文字相关推荐

最新文章

热门文章

HTML CSS 个人注册界面实现边框上加文字

HTML CSS 个人注册界面实现边框上加文字相关推荐