设为首页收藏本站

九九站长,站长论坛,discuz教程

 找回密码
 立即注册
查看: 993|回复: 1
收起左侧

[div+css技术] div+css教程——布局属性!重要的一课!

[复制链接]

250

主题

344

帖子

3337

积分

九七级-版主

Rank: 7Rank: 7Rank: 7

交易币
1712 枚
发表于 2013-5-16 20:04:59 | 显示全部楼层 |阅读模式

注册加入九九站长论坛,一起交流,学习,分享网站技术,资源等!

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

x
    如标题,下面讲的这些属性都是用来布局用的:

flat指定元素块在包含块中向那个方向浮动,默认的是none,不浮动,也可取值为:left  左,  right  右!
clear这个是清除浮动的意思,默认的的none,元素的两边都允许浮动,也可以取值为:left  左边不允许浮动,right  右边不允许浮动,both  两边都不允许浮动!
display指定元素如何显示,取值有:none,block,inline,none的意思是元素隐藏,不显示,block的意思说不行内元素转换成块及元素,inline意思就相反,把块及元素转换成行内元素!
visbility指定元素是否可见,值有:visible 、hidden、 collapse、visble的意思是说可见,hidden的意思是不可见。collapse用与表格的删除,可以删除一行或一列!     不常用!可以只做了解!
overflow
指定内容溢出元素框的大小后,取值有:visible,hidden,scroll,auto。visible的意思是说内容出现在元素框之外,hidden是不显示超出的内容,scroll是超出后用滚动条来查看超出的内容,auto是自动显示滚动条,就是说超出就显示滚动条,没超出就不显示滚动条!
cursor这个属性是用在当鼠标放到元素上的时候光标显示的类型,比如当光标放到一个div上的时候,光标是手型还是光标呈现为十字线!    不常用!可以只做了解!

常用的有如下一些属性:
float:left;                   左浮动
float:right;                右浮动
clear:both;               清除两边的浮动
display:block;            转换成块几元素
overflow:hidden;       超出后隐藏内容


最常用的就是上面那几个属性,可以说每次布局,每个网页都要用到这几个,多多练习!

浮动讲解:如一个宽500像素的div,里面有两个宽100像素的div,那么给里面其中个div添加左浮动,另外个div添加右浮动,那么他的效果就如下图:
未标题-1.jpg


转换成块及元素,最常见的用法,就是在a标签上,a是链接标签,它也是一个行内元素,通常在用a标签做导航的时候,都呀转换成块及元素来使用,如:
<a href="http://www.d929.com" target="_blank" style="background:red">九九站长</a>
上面我给a标签添加了背景颜色为红色,显示的时候就如下图:
1.jpg

只有字体那么那点的地方,因为它是行内元素,前面讲过行内元素跟块及元素的,行内元素不能添加宽高的属性,添加了也没有用的,那么给a连接添加了转换块及元素后,在定义宽高,那么就有用了,如:
<a href="http://www.d929.com" target="_blank" style="background:red;display:block;width:100px;height:100px;">九九站长</a>
显示如下图:
1.jpg

这时候a连接标签就有那么大了,只要把鼠标放到红色的区域,也可以点击连接!最常用的就把导航转换成块及元素!

随便逛逛,增加下人气!

60

主题

137

帖子

1444

积分

九九级-信息监察员

Rank: 9Rank: 9Rank: 9

交易币
680 枚
发表于 2013-5-17 08:45:05 | 显示全部楼层
这课讲的有点多 哦!
特别无聊,来九九站长看下教程!
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

网上报警岗亭图标

Archiver|手机版|小黑屋|九九站长网 ( 渝ICP备13002263 )  
站长论坛   建站教程   discuz教程   discuz模板下载   网站优化
九九站长论坛版权所有:© 2001-2015;如有侵犯你的权利,请告知!

网警备案图
快速回复 返回顶部 返回列表