仓酷云

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

[DIV+CSS] DIV教程之CSS3网页制造实例:content属性的综适用法

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

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

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

x
可以将站点上所有的网页风格都使用一个CSS文件进行控制,只要修改这个CSS文件中相应的行,那么整个站点的所有页面都会随之发生变动。
破洛洛文章简介:在已往我们能够经由过程后端服务器程序截取或JS截取笔墨后到场省略号便可。如今,我们的CSS3.0可使用完成了!
 平常博客等常常会有文章择要,将笔墨截断后间接利用省略号暗示文章还没有停止,以下所示:
在人际干系中,优秀的第一印象长短常主要的,人们乐意在相互身上追求信托与老实,并希冀在接上去的履历中重现和加强这些好感。一样的事理也表现在挪动使用或互联网产物中。在打造优秀的品牌信用及其与终端用户之间持......
在已往我们能够经由过程后端服务器程序截取或JS截取笔墨后到场省略号便可。如今,我们的CSS3.0可使用完成了!


content属性:
  假如我们想往段落p标签外部追加省略号只必要以下体例界说款式便可:
  p:after{content:"...";}

  固然我们也能够追加任何笔墨:
  p:after{content:"网页教授教养网";}

  既然CSS3能够追加内容after,那末CSS3也为我们供应了前置内容的办法before:
  p:before{content:"...";}

  假如我们利用标签选择器界说了一切的p,可是又有需求请求某一个p且ID为box的元素禁绝主动追加或前置内容,那末我们就能够对content属性制订none值(none值只能用于before和after这两种选择器)或normal(任何选择器都没成绩)值便可:
  #box:before{content:none;}


总结:content属性次要经由过程伪类选择器:before和:after来指定地位;
content属性的值能够为任何内容;
当content属性的值为none,则暗示不拔出任何内容;


如今我们来看一下content属性的综适用法:
<!DOCTYPEHTML>
<html>
<head>
<metacharset="gb2312">
<title>CSS3教程网页内容处置-拔出笔墨|网页教授教养网(poluoluo.com)!</title>
<styletype="text/css">
*{margin:0;padding:0;}
body{margin-bottom:20px;font-size:14px;font-family:"MicrosoftYahei";}
p{height:30px;line-height:30px;}
p:before{content:"网页教授教养网(poluoluo.com)!";}
div:after{content:"网页教授教养网供应最新的网页制造、网页计划、网页殊效,为团体网站供应网页素材模板和网页视频进修!";}
#box1:after{content:"..."}
#box2:after{content:none;}
</style>
</head>

<body>
<p>【原本的笔墨】</p>
<div>【原本的笔墨】</div>
<divid="box1">【原本的笔墨,这个将演示省略号】</div>
<divid="box2">【原本的笔墨】</div>
</body>
</html>
</p>
有了CSS,我们不再需要用FONT标签或者透明的1pxGIF图片来控制标题,改变字体颜色,字体样式等等
小魔女 该用户已被删除
沙发
发表于 2015-1-17 20:07:28 | 只看该作者
学Dreamweaver技术的过程其实是一个增加信心的过程。
小女巫 该用户已被删除
板凳
发表于 2015-2-5 05:14:59 | 只看该作者
技术的学习如同长跑。只要越过极限,就会越跑越轻松。技术的学习其实并不像想象中那么可怕,任何技术都并不高深莫测。
飘灵儿 该用户已被删除
地板
 楼主| 发表于 2015-2-11 06:52:04 | 只看该作者
技术的学习如同长跑。只要越过极限,就会越跑越轻松。技术的学习其实并不像想象中那么可怕,任何技术都并不高深莫测。
柔情似水 该用户已被删除
5#
发表于 2015-3-2 00:28:48 | 只看该作者
dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS,三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。
海妖 该用户已被删除
6#
发表于 2015-3-11 03:37:12 | 只看该作者
所见则所得网页编辑器的优点就是直观性,使用方便,容易上手.
若天明 该用户已被删除
7#
发表于 2015-3-17 21:12:14 | 只看该作者
运动)时间轴面板--拖动关键帧--单击整条--将鼠标移至中间一点--右击选择增加关键帧--移动中间关键帧的图层--勾选自动播放,循环
再见西城 该用户已被删除
8#
发表于 2015-3-25 07:01:30 | 只看该作者
俗话说:兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中,我们难免会遇到各种各样的问题。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

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

GMT+8, 2024-12-22 20:04

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

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