仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 947|回复: 8
打印 上一主题 下一主题

[DIV+CSS] DIV教程之尺度下隔行换色的思索

[复制链接]
金色的骷髅 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 10:37:29 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
CSS是CascadingStyleSheets的缩写,不得不承认CSS单独使用会麻烦一点,但其与脚本语言(如我们四阶段所学的Javascript)及XML技术的融合,即可达到绝佳的页面效果。



我们之前在DW顶用表格结构着我们的网页的时分经常用到一种计划伎俩--隔行换色。也就是旧事列表或是列表类的每隔一行就换另外一个色采如许显得很大度也很符合浏览。以是这类伎俩被宽大的计划师们支出囊中作为本人的又一把工具刀。可是跟着网页尺度海潮的来袭,这类计划效果渐渐变得没有了,缘故原由次要是来自于尺度化后的这类效果的完成上。
因为尺度后我们都用UL来取代了表格,代码固然少了良多,可是仿佛效果也随之少了。隔行换色也碰到了瓶颈。我接纳过CLASS体例来举行隔行换色:
<liclass="one"></li>
<liclass="two"></li>
<liclass="one"></li>
<liclass="two"></li>
</ul>
我们看到下面的代码所体现出来的是每行的CLASS都纷歧样,经由过程如许的体例切实其实能够办理隔行换色的成绩,可是一向来我都被程序员告诉如许写法程序没举措写。我一向很忧郁:用表格时他们是怎样写的?
固然埋怨回埋怨,成绩老是必要办理的,以后有伴侣想过用JS来完成隔行换色,这类假想在网页尺度研讨同盟中失掉了辩驳,以为款式的事没需要用举动往实理,而且用JS来完成的效果其实不必定有CSS来办理的好。我批准如许的看法,而且我主意的是年夜背景完成。甚么叫年夜背景完成呢,意义就是说经由过程在父级设定背景从而使妥当前级失掉隔行换色或是隔N行换N色。
<h3><span>向导发言</span><em><ahref=""title="">点击这里</a></em></h3>
<ul>
<li><ahref=""alt="">假字以数十字为基本假字数…</a><em>(2006-12-18)</em></li>
<li><ahref=""alt="">假字以数十字为基本假字数…</a><em>(2006-12-18)</em></li>
<li><ahref=""alt="">假字以数十字为基本假字数…</a><em>(2006-12-18)</em></li>
<li><ahref=""alt="">假字以数十字为基本假字数…</a><em>(2006-12-18)</em></li>
<li><ahref=""alt="">假字以数十字为基本假字数…</a><em>(2006-12-18)</em></li>
</ul>
</div>
上图是我头几天刚完成的一个项目中的一个实例使用,人人能够看到我接纳的是两行背景反复。而这个背景图是界说在UL上的而不界说在LI上。如许又使得我们少写一点代码,让代码显得加倍的洁净。同时如许技能经由过程触类旁通的思索就可以做出更多很好玩的款式来,好比我们让每行都纷歧样,或是让每行都像是纸页脚卷起来一样,或是别的的甚么名堂,那就要看你能想出甚么样的把戏来了!
首先你要知道,当你开始学习DIV+CSS的时候,你要把以前所有用DW画布局表格的思维方法忘的一干二净(如果你以前是用TABLE布局的话),然而这项技术更适合刚接触网页制作的人。
透明 该用户已被删除
沙发
发表于 2015-1-18 07:17:27 | 只看该作者
只要我们努力,无论是怎样的艰难险阻,成功依然会迎面直击。在刚开始时我觉得dreamweavermxXX很难理解。
小妖女 该用户已被删除
板凳
发表于 2015-1-26 05:11:35 来自手机 | 只看该作者
只要我们努力,无论是怎样的艰难险阻,成功依然会迎面直击。在刚开始时我觉得dreamweaver mx XX很难理解。
不帅 该用户已被删除
地板
发表于 2015-2-4 15:37:30 | 只看该作者
布局表格、绘制层、制作CSS样式表等,这些内容迷糊了我的视线,真是没想到制作一个精巧别致的网页是如此的困难,可是心有不甘。
若天明 该用户已被删除
5#
发表于 2015-2-10 03:16:00 | 只看该作者
使用所见即所得的接口,亦有HTML编辑的功能。它现在有Mac和Windows系统的版本。原本由Macromedia公司所开发。
莫相离 该用户已被删除
6#
发表于 2015-2-28 18:48:16 | 只看该作者
还可以在Dreamweaver常用工具中选择超级链接,完成相应的填写即可。
小魔女 该用户已被删除
7#
发表于 2015-3-10 07:05:56 | 只看该作者
可以使用 CSS 检查工具进行设计。
愤怒的大鸟 该用户已被删除
8#
发表于 2015-3-17 06:10:09 | 只看该作者
俗话说:兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中,我们难免会遇到各种各样的问题。
乐观 该用户已被删除
9#
发表于 2015-3-23 23:34:05 | 只看该作者
还是在Dreamweaver所见即所得添加链接是,可以选中文字或图片然后按下shift键不放鼠标拖出箭头直接指向文件即可。这是比较简单的也是常用的方之一。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-12-23 13:35

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表