HTML和CSS美化 登入框的页面

                     <div id="leftbody">
                             <p class="p0">如果您感觉您的网站够炫美可以提交给我们!</p>
                             <form>
                             <label for="label1">您的姓名:</label>
                             <input type="text" name="name" id="label1" size="30" />
                             <label for="label2">您的联系方式:</label>
                             <input type="text" name="content" id="label2" size="30" />
                             <label for="label3">站点网址:</label>
                             <input type="text" name="url" id="label3" size="30"/>
                             <label for="label4">站点介绍:</label>
                             <textarea name="info" id="label4" cols="50" rows="8" > </textarea>
                             <div class="sub">
                                     <input class="btn_sub" type="submit" value="提交" />
                                     <input class="btn_sub btn2" type="reset"  value="重置" />
                             </div>
                             </form>
                     </div>
#wrap #leftbody p.p0{
    color:#000;
    font-size:18px;
    margin:50px 0 20px 0;
    }
#leftbody form label{
    display:block;
    font-size:14px;
    color:#555555;
    margin:15px 0 3px 0 ;
    }
#leftbody form input.btn_sub{
    background:url(default.png);
    display:block;
    width:103px;
    height:27px;
    text-align:center;
    line-height:27px;
    color:#ffffff;
    text-decoration:none;
    font-weight:bold;
    border:none;
    cursor:pointer;
    float:left;
    margin-top:20px;
    }
#leftbody form input.btn2{
    margin-left:170px;
    }
#leftbody form .btn_sub:hover{
    background:url(d_hover.png);
    }
一般网页设计public页面的设置

body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,form,input,textarea,p {
    margin:0px;
    padding:0px;
    font-size:13px;
}
ul {
    list-style:none;
}
img,a img {
    border:none;
}
a {
    text-decoration:none;
}
a:hover {
    text-decoration:underline;
}
时间: 2024-10-07 02:48:42

HTML和CSS美化 登入框的页面的相关文章

CSS 美化复选框 - 无图片方式

今天和大家分享一个不使用图片美化复选框的方式.来看下效果图吧,如下是3种不同状态下的效果: 一. Html结构 <div class="check-wrap"> <input type="checkbox" class="icheck" id="icheck" /> <label for="icheck" class="ilabel"></lab

连接数据库:登入与处理

登入就是提取数据库中的信息 先建立一个登入页面: <!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

模拟操作银行登入页面。。。未连接数据库

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <

【CSS笔记】CSS3美化复选框

以前在网上看到各种有关css3美化复选框的例子,今天整理出来,方便以后查看. 此例涉及到:input和lable的绑定,opacity(不透明度)的使用 先上效果: 源码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>CSS3美化复选框</title> <style type="tex

只用CSS美化选择框

只用CSS美化选择框 2012-03-02 11:04 by iBlog, 26240 阅读, 14 评论, 收藏, 编辑 <本文译自Style a Select Box Using Only CSS> 当我需要用下拉列表拼凑自定义表单时,我常常不得不使用下拉框(select),由于某些部分是浏览器特定的,如下拉箭头,我花了一段时间去搞清楚如何只使用css轻松地美化下拉框. 下面是一个默认样式的下拉框的长相: Here is the first option The second option

css实现input文本框的双边框美化

<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>css实现input文本框的双边框美化</title><style type="text/css">.input_div{width:250px; height

Ajax基础与登入

Ajax 是 Asynchronous JavaScript and XML的缩写. Ajax的优点: 优点:减轻服务器的负担,按需取数据,最大程度的减少冗余请求 局部刷新页面,减少用户心理和实际的等待时间,带来更好的用户体验 基于xml标准化,并被广泛支持,不需安装插件等 进一步促进页面和数据的分离 Ajax包含下列技术: 基于web标准(standards-based presentation)XHTML+CSS的表示: 使用 DOM(Document Object Model)进行动态显示

css美化界面

登录界面jsp代码 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>登录界面</title> <

第七十五天上课 php注册登入审核和文件上传

文件上传 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>文件上传</title> <?php if(!(empty($_FILES['file']) || empty($_POST['submit']))) { $urls="./my-img/".$_FILES['file']['name']; /