仓酷云

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

[DIV+CSS] 给大家带来CSS+DIV制造页面圆角效果

[复制链接]
金色的骷髅 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 00:17:59 | 显示全部楼层 回帖奖励 |倒序浏览 |阅读模式

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

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

x
每个声明内只能有一个属性,如果属性值中含有空格用双引号括起来例,在一个声明块内可以有多个声明,每个声明用分号隔开。
款式表文件:
.b1{height:1px;font-size:1px;overflow:hidden;display:block;background:#000;margin:05px;}
.b2{height:1px;font-size:1px;overflow:hidden;display:block;background:#fff;
border-right:2pxsolid#000;border-left:2pxsolid#000;margin:03px;}
.b3{height:1px;font-size:1px;overflow:hidden;display:block;background:#fff;
border-right:1pxsolid#000;border-left:1pxsolid#000;margin:02px;}
.b4{height:2px;font-size:1px;overflow:hidden;display:block;background:#fff;
border-right:1pxsolid#000;border-left:1pxsolid#000;margin:01px;}

接着看页面代码:
<bclass="b1"></b><bclass="b2"></b><bclass="b3"></b><bclass="b4"></b>
<bclass="b4"></b><bclass="b3"></b><bclass="b2"></b><bclass="b1"></b>
固然你也能够用其他的标签<div>大概<span><a>之类,应当也是能够的

在下面两句之间加上一个摆布border的content
这就是效果了:


看分明了吗?我们来细心剖析一下代码吧:


十分困难才做好这张图,也不晓得怎样体现加倍分明,我信任人人应当能看得懂吧,道理就是在象素做图。是否是很成心思呢~CSS的功效真的好壮大啊,分明道理后就可以触类旁通计划出很多款式了,让我们勇敢的计划出各类效果吧,深信css能完成的,
当遇到几个选择器共享一个声明的时候,可以分组放在一起,每个选择器必须以逗号隔开。例:h1,h2,h3,h4{colorred;}选择器分组时要将每个选择器路径写全,分组结尾不能有逗号。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

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

GMT+8, 2024-5-18 09:14

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

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