仓酷云

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

[DIV+CSS] CSS教程之玩转CSS CSS出色实例教程(三)

[复制链接]
精灵巫婆 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 00:20:22 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

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

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

x
Div全称division意为“区分”使用DIV的方法跟使用其他tag的方法一样。
  12、把持BOX的款式
  款式表划定了一个容器BOX,它将要贮存一个工具的一切可操纵的款式。包含了工具自己、边框空缺、工具边框、工具间隙四个方面。
  为了人人更好地舆解这些属性的意义,和相互之间的干系,请看上面这个图示:

  1.边框空缺(MARGIN)
  如图所示,位于BOX模子的最外层,包含四项属性。
  格局分离以下:
  ・margin-top:顶部空缺间隔
  ・margin-right:右侧空缺间隔
  ・margin-bottom:底部空缺间隔
  ・margin-left:右边空缺间隔
  空缺的间隔能够用带长度单元的数字暗示。
  假如利用上述属性的简化体例margin,能够在厥后一连加上四个带长度单元的数字,来分离暗示margin-top、margin-right、margin-bottom、margin-left,每一个数字两头要用空格分开。
  2.工具边框(BORDER)
  如图所示,位于边框空缺和工具清闲之间,包含了七项属性。
  格局分离以下:
  ・border-top:顶边框宽度
  ・border-right:右侧框宽度
  ・border-bottom:底边框宽度
  ・border-left:右边框宽度
  ・border-width:一切边框宽度
  ・border-color:边框色彩
  ・border-style:边框款式参数
  个中border-width能够一次性设置一切的边框宽度,border-color同时设置四周边框的色彩时,能够一连写上四种色彩,并用空格分开。上述一连设置的边框都是按border-top、border-right、border-bottom、border-left的按次。
  Border-style绝对其余属性而言稍稍庞大些,由于它还包含了多个边框款式的参数:
  ・none:无边框。
  ・dotted:边框为点线。
  ・dashed:边框为是非线。
  ・solid:边框为实线。
  ・double:边框为双线。
  ・groove:依据color属性显现分歧效果的3D边框
  ・ridge:依据color属性显现分歧效果的3D边框
  ・inset:依据color属性显现分歧效果的3D边框
  ・outset:依据color属性显现分歧效果的3D边框
  3.工具间隙(PADDING)
  如图所示,位于工具边框和工具之间,包含了四项属性。
  基础格局以下:
  ・padding-top:顶部间隙
  ・padding-right:右侧间隙
  ・padding-bottom:底部间隙
  ・padding-left:右边间隙
  和MARGIN相似,PADDING也能够用padding一次性设置一切的工具间隙,格局也和MARGIN类似,不再逐一枚举了。
  十3、显现把持款式
  基础格局以下:
  display:参数
  参数取值局限:
  ・block(默许):在工具前后都换行
  ・inline:在工具前后都不换行
  ・list-item:在工具前后都换行,增添了项目标记
  ・none:无显现
  十4、空缺把持款式
  基础格局以下:
  空缺属性决意怎样处置元素内的空格。
  white-space:参数
  参数取值局限:
  normal:把多个空格交换为一个来显现
  pre:忠厚地按输出显现空格
  nowrap:克制换行
  但要注重的是,write-space也是一个块级属性。
</p>
Table中布局中,垃圾代码会很多,一些修饰的样式及布局的代码混合一起,很不利于直观。而Div更能体现样式和结构相分离,结构的重构性强。
小女巫 该用户已被删除
沙发
发表于 2015-1-18 06:08:47 | 只看该作者
在刚开始接触网页的第一堂课上,听说网页制作会是一门很无聊并且很难听懂的过程,而事实却印证了这样一个事实。
冷月葬花魂 该用户已被删除
板凳
发表于 2015-1-22 05:37:32 | 只看该作者
HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器)
飘灵儿 该用户已被删除
地板
发表于 2015-2-6 16:53:49 | 只看该作者
俗话说:兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中,我们难免会遇到各种各样的问题。
透明 该用户已被删除
5#
发表于 2015-2-17 14:56:32 | 只看该作者
Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器,在编辑时能同时看到源码和设计界面,非常方便新手学习制作网页。
谁可相欹 该用户已被删除
6#
发表于 2015-3-5 20:41:07 | 只看该作者
难以逾越的障碍会大大打击你的学习积极性。这就需要你的恒心,坚持不懈的决心。在自己无法解决某些问题时,就需要虚心请教别人.
山那边是海 该用户已被删除
7#
发表于 2015-3-12 14:58:40 | 只看该作者
Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器,在编辑时能同时看到源码和设计界面,非常方便新手学习制作网页。
乐观 该用户已被删除
8#
发表于 2015-3-19 23:25:33 | 只看该作者
在刚开始接触网页的第一堂课上,听说网页制作会是一门很无聊并且很难听懂的过程,而事实却印证了这样一个事实。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

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

GMT+8, 2024-12-24 02:26

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

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