-
[css教程] 详解CSS背景Background属性 日期：2011-03-23 09:03:53 点击：948 好评：0
本文详解了CSS的背景属性Background，包括CSS3中新增的背景属性。如果你是个CSS初学者，还可以查看之前介绍的CSS浮动属性和CSS透明属性详解。
css2 中的背景(background)
CSS2 中有5个主要的背景(background)属性，它们是：
background-color...
-
[css教程] 详解CSS盒子模型 日期：2011-03-22 11:43:15 点击：1210 好评：0
CSS盒模型，多么专业的一个术语。但你不要被它吓到，不过就是一些CSS基本属性的应用而已。
CSS 盒模型
网页设计中的每个元素都是长方形的盒子。盒子的尺寸是怎样精确计算的，请看下图：
如果是 Firebug 用户的话(基本和前端有关的都会用到 Firebug 吧 –...
-
[css教程] 符合标准的可访问的可视化CSS数据图表 日期：2011-03-22 11:38:19 点击：70 好评：0
Horizontal Bar Chart / Accessible Data Examples
-
[css教程] 详解CSS中background(背景)属性的语法 日期：2011-03-22 11:30:26 点击：188 好评：0
本文详解了CSS的背景属性Background，包括CSS3中新增的背景属性。
背景 background
css 说明
background-image:url("图片的网址"); 背景图
background: url(" 图片的网址 "); 背景
background-color:#色码; 背景色彩
background-image:url(背...
-
[css教程] 所有的CSS样式都应放在Head Tag 日期：2011-03-22 11:21:40 点击：77 好评：0
理论上来说你可以将样式放在您想要的任何位置。
但是HTML规范的建议，将他们放在文件头标记。
主要的好处是，您的网页加载速度似乎更快一些。
示例：
应把所有CSS样式都放在Head Tag ... </p>
</li><li> <a href='/wangyesheji/css/201103/22-6821.html' class='preview'><img src='/System/images/defaultpic.gif'/></a>
[<b><a href='/wangyesheji/css/'>css教程</a></b>] <a href="/wangyesheji/css/201103/22-6821.html" class="title">css制作漂亮的新闻列表</a> <span class="info"> <small>日期：</small>2011-03-22 11:05:35 <small>点击：</small>957 <small>好评：</small>0 </span>
<p class="intro"> 本文我们说说新闻列表，新闻列表是一个网站的重要组成元素。我们会经常碰到它，如何处理他的外观显得尤为重要。这个实例中，我们将标题与日期作单独的浮动，而且在链接的鼠标悬停时，呈现出不同的色彩变化。而且我们控制LI的背景，让其也产生一些交互。总体上的效果还不... </p>
</li><li> <a href='/wangyesheji/css/201103/22-6820.html' class='preview'><img src='/System/images/defaultpic.gif'/></a>
[<b><a href='/wangyesheji/css/'>css教程</a></b>] <a href="/wangyesheji/css/201103/22-6820.html" class="title">Google谷歌Logo的CSS前景图片合并技术</a> <span class="info"> <small>日期：</small>2011-03-22 10:07:18 <small>点击：</small>241 <small>好评：</small>0 </span>
<p class="intro"> 在Mb5u.com以前的文章中介绍过背景图片的合并方法。但不只有背景图片能合并，前景图片同样可以。
在 Google 搜索结果页面中，将其 Logo 图标右键另存为后可以发现，它并非单纯的 Google Logo，而是一块复杂的拼合图片：
查看搜索页面源代码，其 Logo ... </p>
</li><li> <a href='/wangyesheji/css/201103/22-6819.html' class='preview'><img src='/System/images/defaultpic.gif'/></a>
[<b><a href='/wangyesheji/css/'>css教程</a></b>] <a href="/wangyesheji/css/201103/22-6819.html" class="title">用CSS控制打印(代码)</a> <span class="info"> <small>日期：</small>2011-03-22 10:01:56 <small>点击：</small>144 <small>好评：</small>0 </span>
<p class="intro"> 我们先看一下效果：
如何用CSS控制打印，下面的代码或许能够给你帮助。
<style>
@media print{
INPUT {display:none}
}
</style>
<TABLE border="0" style="font-size:9pt;" width="300px" align="center">
&l... </p>
</li><li> <a href='/wangyesheji/css/201103/21-6806.html' class='preview'><img src='/System/images/defaultpic.gif'/></a>
[<b><a href='/wangyesheji/css/'>css教程</a></b>] <a href="/wangyesheji/css/201103/21-6806.html" class="title">纯CSS3打造可折叠树状菜单</a> <span class="info"> <small>日期：</small>2011-03-21 15:22:58 <small>点击：</small>137 <small>好评：</small>0 </span>
<p class="intro"> 随着CSS3的发布，国外研究正如火如荼，但是由于IE不支持CSS3，很多人始终无动于衷不肯去学习。但是历史告诉我们，好的东西必将盛行，CSS3也终将也会替代CSS2，下面就和大家分享一个用CSS3打造的可折叠树状菜单。
树状菜单相信大家都不会陌生，我们一般用css+JS 的方式来... </p>
</li><li> <a href='/wangyesheji/css/201103/20-6796.html' class='preview'><img src='/System/images/defaultpic.gif'/></a>
[<b><a href='/wangyesheji/css/'>css教程</a></b>] <a href="/wangyesheji/css/201103/20-6796.html" class="title">轻松解决overflow属性中间间距小技巧</a> <span class="info"> <small>日期：</small>2011-03-20 10:13:59 <small>点击：</small>69 <small>好评：</small>0 </span>
<p class="intro"> 本文教你轻松解决overflow属性中间间距问题，小技巧而已，希望对大家有帮助。
通常我们在制作上图的时候，会分别给四个div加上不同的css属性，来实现中间间隔。但我们更希望的是不需要对html标签做标识，直接能通过css实现，我们这里使用overflow:hidden属性。或许很多人... </p>
</li>
</ul>
</div>
<!-- /listbox -->
<div class="dede_pages">
<ul class="pagelist">
<li><a href='15-1.html'>首页</a></li>
<li><a href='15-55.html'>上一页</a></li>
<li><a href='15-51.html'>51</a></li>
<li><a href='15-52.html'>52</a></li>
<li><a href='15-53.html'>53</a></li>
<li><a href='15-54.html'>54</a></li>
<li><a href='15-55.html'>55</a></li>
<li class="thisclass">56</li>
<li><a href='15-57.html'>57</a></li>
<li><a href='15-58.html'>58</a></li>
<li><a href='15-59.html'>59</a></li>
<li><a href='15-60.html'>60</a></li>
<li><a href='15-61.html'>61</a></li>
<li><a href='15-57.html'>下一页</a></li>
<li><a href='15-90.html'>末页</a></li>
<li><select name='sldd' style='width:42px' onchange='location.href=this.options[this.selectedIndex].value;'>
<option value='15-1.html'>1</option>
<option value='15-2.html'>2</option>
<option value='15-3.html'>3</option>
<option value='15-4.html'>4</option>
<option value='15-5.html'>5</option>
<option value='15-6.html'>6</option>
<option value='15-7.html'>7</option>
<option value='15-8.html'>8</option>
<option value='15-9.html'>9</option>
<option value='15-10.html'>10</option>
<option value='15-11.html'>11</option>
<option value='15-12.html'>12</option>
<option value='15-13.html'>13</option>
<option value='15-14.html'>14</option>
<option value='15-15.html'>15</option>
<option value='15-16.html'>16</option>
<option value='15-17.html'>17</option>
<option value='15-18.html'>18</option>
<option value='15-19.html'>19</option>
<option value='15-20.html'>20</option>
<option value='15-21.html'>21</option>
<option value='15-22.html'>22</option>
<option value='15-23.html'>23</option>
<option value='15-24.html'>24</option>
<option value='15-25.html'>25</option>
<option value='15-26.html'>26</option>
<option value='15-27.html'>27</option>
<option value='15-28.html'>28</option>
<option value='15-29.html'>29</option>
<option value='15-30.html'>30</option>
<option value='15-31.html'>31</option>
<option value='15-32.html'>32</option>
<option value='15-33.html'>33</option>
<option value='15-34.html'>34</option>
<option value='15-35.html'>35</option>
<option value='15-36.html'>36</option>
<option value='15-37.html'>37</option>
<option value='15-38.html'>38</option>
<option value='15-39.html'>39</option>
<option value='15-40.html'>40</option>
<option value='15-41.html'>41</option>
<option value='15-42.html'>42</option>
<option value='15-43.html'>43</option>
<option value='15-44.html'>44</option>
<option value='15-45.html'>45</option>
<option value='15-46.html'>46</option>
<option value='15-47.html'>47</option>
<option value='15-48.html'>48</option>
<option value='15-49.html'>49</option>
<option value='15-50.html'>50</option>
<option value='15-51.html'>51</option>
<option value='15-52.html'>52</option>
<option value='15-53.html'>53</option>
<option value='15-54.html'>54</option>
<option value='15-55.html'>55</option>
<option value='15-56.html' selected>56</option>
<option value='15-57.html'>57</option>
<option value='15-58.html'>58</option>
<option value='15-59.html'>59</option>
<option value='15-60.html'>60</option>
<option value='15-61.html'>61</option>
<option value='15-62.html'>62</option>
<option value='15-63.html'>63</option>
<option value='15-64.html'>64</option>
<option value='15-65.html'>65</option>
<option value='15-66.html'>66</option>
<option value='15-67.html'>67</option>
<option value='15-68.html'>68</option>
<option value='15-69.html'>69</option>
<option value='15-70.html'>70</option>
<option value='15-71.html'>71</option>
<option value='15-72.html'>72</option>
<option value='15-73.html'>73</option>
<option value='15-74.html'>74</option>
<option value='15-75.html'>75</option>
<option value='15-76.html'>76</option>
<option value='15-77.html'>77</option>
<option value='15-78.html'>78</option>
<option value='15-79.html'>79</option>
<option value='15-80.html'>80</option>
<option value='15-81.html'>81</option>
<option value='15-82.html'>82</option>
<option value='15-83.html'>83</option>
<option value='15-84.html'>84</option>
<option value='15-85.html'>85</option>
<option value='15-86.html'>86</option>
<option value='15-87.html'>87</option>
<option value='15-88.html'>88</option>
<option value='15-89.html'>89</option>
<option value='15-90.html'>90</option>
</select></li>
<li><span class="pageinfo">共 <strong>90</strong>页<strong>899</strong>条</span></li>
</ul>
</div>
<!-- /pages -->
</div>
<!-- /pleft -->
<div class="pright">
<div>
<dl class="tbox">
<dt><strong>栏目列表</strong></dt>
<dd>
<ul class="d6">
<li><a href='/wangyesheji/wangyepeise/'>网页配色</a></li>
<li><a href='/wangyesheji/wangyebuju/'>网页布局</a></li>
<li><a href='/wangyesheji/html/'>html/xhtml</a></li>
<li><a href='/wangyesheji/css/' class='thisclass'>css教程</a></li>
<li><a href='/wangyesheji/wangyetexiao/'>网页特效</a></li>
<li><a href='/wangyesheji/xindejiqiao/'>心得技巧</a></li>
</ul>
</dd>
</dl>
</div>
<div id="listRtPicAD" style="margin:10px auto"><!-- 250x250启用SSP 开始 --><script type="text/javascript">var _mda_place_id ="58bcc82381892";</script><script type="text/javascript" src="http://place.ssp.desdev.cn/pageplace/show.js"></script><!-- 250x250启用SSP 结束 --></div>
<div class="commend">
<dl class="tbox light">
<dt class='light'><strong>推荐内容</strong></dt>
<dd class='light'>
<ul class="d4">
<li><a href="/wangyesheji/css/201907/17-12561.html">工信部今日发放5G商用牌照-PHP100中文网 - 中</a>
<p>央视快讯：工信部向中国电信、中国移动、中国联通、中国广电发放5G商用牌照。 2016年5...</p>
</li>
</ul>
</dd>
</dl>
</div>
<!-- /commend -->
<div class="hot mt1 light">
<dl class="tbox">
<dt class='light'><strong>热点内容</strong></dt>
<dd class='light'>
<ul class="c1 ico2">
<li><a href="/wangyesheji/css/201105/02-7353.html">CSS中Zoom属性的一些介绍</a></li>
<li><a href="/wangyesheji/css/201001/03-3352.html">【DIV+CSS入门教程】制作网页导</a></li>
<li><a href="/wangyesheji/css/201001/03-3351.html">【DIV+CSS入门教程】浮动(float)</a></li>
<li><a href="/wangyesheji/css/201105/10-7436.html">CSS中如何调整行距,字距</a></li>
<li><a href="/wangyesheji/css/201001/03-3364.html">【DIV+CSS入门教程】DIV+CSS的叫</a></li>
<li><a href="/wangyesheji/css/201001/03-3346.html">【DIV+CSS入门教程】CSS首行文字</a></li>
<li><a href="/wangyesheji/css/201001/03-3363.html">【DIV+CSS入门教程】使用Table布</a></li>
<li><a href="/wangyesheji/css/200910/07-2875.html">推荐一份不错的清除默认样式的CS</a></li>
<li><a href="/wangyesheji/css/201001/03-3361.html">【DIV+CSS入门教程】CSS如何控制</a></li>
<li><a href="/wangyesheji/css/200903/09-1713.html">1.精通CSS样式表－第1日</a></li>
</ul>
</dd>
</dl>
</div>
<a href='http://2v.dedecms.com/' id='__dedeqrcode_1'>织梦二维码生成器</a>
<script type="text/javascript">
var __dedeqrcode_id=1;
var __dedeqrcode_aid=15;
var __dedeqrcode_type='list';
var __dedeqrcode_dir='/System/plus';
</script>
<script language="javascript" type="text/javascript" src="/System/plus/img/qrcode.js"></script>
<div id="listRtPicAD2" style="margin:10px auto"><!-- 250x250普通 开始 --><script type="text/javascript">var _mda_place_id ="58bcc92e8b472";</script><script type="text/javascript" src="http://place.ssp.desdev.cn/pageplace/show.js"></script><!-- 250x250普通 结束 --></div>
</div>
<!-- /pright -->
</div>
<div id="innerfooterAD" style="margin:10px auto; width:726px"><!-- 728x90普通 开始 --><script type="text/javascript">var _mda_place_id ="58bce8309bc21";</script><script type="text/javascript" src="http://place.ssp.desdev.cn/pageplace/show.js"></script><!-- 728x90普通 结束 --></div>
<!-- //底部模板 -->
<div class="footer w960 center mt1 clear">
<!--
为了支持织梦团队的发展,请您保留织梦内容管理系统的链接信息.
我们对支持织梦团队发展的朋友表示真心的感谢!织梦因您更精彩!
-->
<div class="footer_left"></div>
<div class="footer_body">
<p class="powered">
Powered by <a href="http://www.dedecms.com" title="织梦内容管理系统(DedeCms)--国内最专业的PHP网站管理系统，轻松建站的首选利器。" target="_blank"><strong>DedeCMS_V57_GBK_SP2</strong></a> © 2004-2017 <a href="http://www.desdev.cn/" target="_blank">DesDev</a> Inc.<br /><div class="copyright">Copyright © 2002-2017 建站学. 晨展科技 版权所有<script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id=cnzz_stat_icon_1275247630%3E%3C/span%3E%3Cscript src=" + cnzz_protocol + "s23.cnzz.com/stat.php%3Fid%3D1275247630%26show%3Dpic1 type=text/javascript%3E%3C/script%3E"));</script>
<script>
(function(){
var bp = document.createElement(script);
var curProtocol = window.location.protocol.split(:)[0];
if (curProtocol === https) {
bp.src = https://zz.bdstatic.com/linksubmit/push.js;
}
else {
bp.src = http://push.zhanzhang.baidu.com/push.js;
}
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bp, s);
})();
</script>
<a href=http://www.dedecms.com target='_blank'>Power by DedeCms</a> <a href="http://www.miibeian.gov.cn/" title="豫ICP备18028807号-1">豫ICP备18028807号-1</a></div></p>
<!-- /powered -->
</div>
<div class="footer_right"></div>
</div>
<!-- /footer -->
</body>
</html>
