爱飞 发表于 2015-1-15 23:11:04

来谈谈:CSS3+HTML5实例:HTML5和CSS3制造登录表单

可以将站点上所有的网页风格都使用一个CSS文件进行控制,只要修改这个CSS文件中相应的行,那么整个站点的所有页面都会随之发生变动。
破洛洛文章简介:HTML5供应了一些新的元素可让我们不必JS轻松完成有用的web表单,CSS3供应了良多新的特征,这些特征同意完成新的计划效果(好比动画、突变等).
HTML5供应了一些新的元素可让我们不必JS轻松完成有用的web表单,CSS3供应了良多新的特征,这些特征同意完成新的计划效果(好比动画、突变等)。

这里做了一个基于HTML5和CSS3的登录表单。实例代码利用到HTML5供应的一些表单新特征,以是你必要利用撑持HTML5和CSS3的扫瞄器来检察。
HTML5代码:
<formid="login">
<h1>用户登录</h1>
<fieldsetid="inputs">
<inputid="username"type="text"placeholder="用户名"autofocusrequired>
<inputid="password"type="password"placeholder="暗码"required>
</fieldset>
<fieldsetid="actions">
<inputtype="submit"id="submit"value="登录">
<ahref="">健忘暗码?</a><ahref="">注册</a>
</fieldset>
</form>
上面是这里用到的几个HTML5属性在最新标准里的注释:



[*]placeholder&ndash;供应一种提醒(hint),形貌输出域所等候的值。(正文:placeholder属性合用于以下范例的<input>标签:text,search,url,telephone,email和password。)提醒(hint)会在输出域为空时显现呈现,会在输出域取得核心时消散:
[*]required&ndash;划定必需在提交之前填写输出域(不克不及为空)。(正文:required属性合用于以下范例的<input>标签:text,search,url,telephone,email,password,datepickers,number,checkbox,radio和file。)
[*]autofocus&ndash;当页面加载时,域主动地取得核心
[*]type=”password”&ndash;界说暗码字段。暗码字段中的字符会被掩码(显现为星号或原点)。

CSS3代码:
这个demo里用到了CSS3的暗影突变等效果。好比,上面的代码用来完成登录表单全部区块的box-shadow效果:

#login{
box-shadow:
002pxrgba(0,0,0,0.2),
01px1pxrgba(0,0,0,.2),
03px0#fff,04px0rgba(0,0,0,.2),
06px0#fff,
07px0rgba(0,0,0,.2);
}
</p>
你的设计不仅仅用于web浏览器,也可以发布在其他设备上,比如PowerPoint。

再现理想 发表于 2015-1-17 16:27:10

由CS4版本开始,则转用WebKit排版引擎(亦即GoogleChrome和AppleSafari浏览器所用的排版引擎)作为网页预览。

金色的骷髅 发表于 2015-1-21 06:44:33

dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS,三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。

若相依 发表于 2015-1-30 10:12:12

Dreamweaver由MX版本开始使用Opera软件公司的排版引擎“Presto”作为网页预览。

小魔女 发表于 2015-2-6 10:09:00

运动)时间轴面板--拖动关键帧--单击整条--将鼠标移至中间一点--右击选择增加关键帧--移动中间关键帧的图层--勾选自动播放,循环

兰色精灵 发表于 2015-2-15 23:11:32

可以使用 CSS 检查工具进行设计。

蒙在股里 发表于 2015-3-4 18:37:51

经过两天的学习,总算对Dreamweaver有进一步的了解了,心中不免有些激动。今天和其他几位老师交流了一下,感觉受益匪浅.

admin 发表于 2015-3-11 20:47:22

在刚开始接触网页的第一堂课上,听说网页制作会是一门很无聊并且很难听懂的过程,而事实却印证了这样一个事实。

柔情似水 发表于 2015-3-19 13:22:15

直接用代码建立链接,如:可以直接输入 <a herf = \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"red.html\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\">红色的网页 12、插入标签法建立链接,可以再选中文字后在代码中插入html标签,页元素<a>.也可以按ctrl+t进入html标签插入方法之后输入代码即可。

山那边是海 发表于 2015-3-28 13:28:25

直接用代码建立链接,如:可以直接输入 <a herf = \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"red.html\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\">红色的网页 12、插入标签法建立链接,可以再选中文字后在代码中插入html标签,页元素<a>.也可以按ctrl+t进入html标签插入方法之后输入代码即可。
页: [1]
查看完整版本: 来谈谈:CSS3+HTML5实例:HTML5和CSS3制造登录表单