立即注册 找回密码

QQ登录

只需一步,快速开始

查看: 9096|回复: 0

[DIV+CSS 教程笔记02] 第一课-第十一课程 时候代码总结

[复制链接]
发表于 2014-11-30 23:24:01 | 显示全部楼层 |阅读模式
道勤网-数据www.daoqin.net

亲注册登录道勤网-可以查看更多帖子内容哦!(包涵精彩图片、文字详情等)请您及时注册登录-www.daoqin.net

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

x
  1. css效果

  2. <!--这个是外联样式的css内容-->
  3. <link href="001.css" rel="stylesheet" type="text/css" />

  4. </head>
  5. ---------------------------------------------------------------------------------------------------------

  6. .aaa{}   类别选择器   
  7. #aaa{}  id选择器

  8. *{}通配选择器
  9. p a{    }包含选择器/父子选择器 的用法,
  10. ---------------------------------------------------------------------------------------------------------------
  11. a{color:#933;}  没有点之前链接的颜色
  12. a:link {color:#933;}  同上没有点击之前链接的颜色
  13. a:visited {color:#9C6;}   浏览过的链接的颜色
  14. a:hover{color:#009;}     鼠标放上去时候链接的颜色
  15. a:active{color:#F06;}    鼠标点击时候链接的颜色
  16. 一般的写法为

  17. h1 a{color:#933;}   没有点击时候链接的颜色

  18. h1 a:hover{color:#009; font-size:36px; background:#0C3;}  鼠标放上去点击链接的颜色


  19. .aaa{background:url(xml.jpg) no-repeat; background-position:bottom;}
  20.               
  21.               其他方式: repeat-x  repeat-y repeat
  22.               其他方式:background-positon:right;  background-positon:left;  background-positon:top;
  23.                         background-position:100px 50px;  这个表示的是图片向右面移动100px之后呢在向下移动50px,

  24. body{background:#F30;}这个是标签的css外联样式
  25. span{color:#00F; font-size:45px;}

  26. h1{color:#FF0; font-family:Verdana, Geneva, sans-serif; font-size:9px; font-weiht:800;}
  27. h2{color:#0C3;}
  28. h3{color:#0F3; background:#000;}

  29. *{ background:#900;}   这个表示的通配选择符的用法
  30. p a{color:#9C9;}   这个表示的是包含选择符的用法

  31. P{color:#F00; font-size:24px; background:#9C6;}
  32. #abc{color:#00F;}

  33. h1,42,p,span,h5{color:#F00;}    2个都可以定义的代码 组合选择符
  34. span,h1{color:#F00;}
  35. h1,h2,h3,h4,h5{color:#3F0; background:#330; font-weight:900;}

  36. ------------------------------------------------------------------------------------------------

  37. <head>
  38. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />   <!--网站的编码 utf-8是一个国际编码,gbk

  39. 是我们国内用到的编码-->
  40. <title>无标题文档</title>
  41. <meta name="keywords" content="道勤教育,道勤学习,道勤网,免费学习,一起交流" />   <!--网站的关键词-->
  42. <meta name="description"  content="让我们一起学习吧,道勤网免费学习网站设计,网站建设,QQ群226547332" />  <!--网站

  43. 描述的用法-->


  44. <style type="text/css">

  45. <!--这里是内联样式的css内容-->

  46. P{color:#F00; font-size:24px; background:#9C6;}
  47. body{background:#F30;}  这个是颜色作为背景的方式
  48. body{ background:url(xml.jpg) no-repeat; }    这个是图片作为背景的代码
  49. span{color:#00F; font-size:45px;}
  50. h1{color:#FF0; font-family:Verdana, Geneva, sans-serif; font-size:9px; font-weiht:800;}
  51. h2{color:#0C3;}
  52. h3{color:#0F3; background:#000;}

  53. </style>


  54. ---------------------------------------------------------------------------------------------------------

  55. HTML代码




  56. <p style="color:#F00;">现在我们一起来学习这个div+css系列教程-道勤网</p>本节视频由 道勤网  提供,全部免费建站视频教

  57. 程请登录道勤网!www.daoqin.net .请关注本节课discuz视频教程!为各位新手站长提供学习交流的互助平台,还可以学到网站推广的

  58. 知识,如:seo等!实实在在的为新手站长包括空间域名的购买指导,到程序的使用,及网站建设,网站优化,网站维护等全方位服务,是道

  59. 勤网努力的方向!QQ群226547332

  60. 这个是无序列表的写法
  61. <ul>
  62. <li class="aaa">道勤网</li>
  63. <li>学设计</li>
  64. <li>淘宝美工</li>
  65. <li>做网站</li>
  66. <li  id="abc"  class="aaa">学设计</li>
  67. <li>一切都是可以从0开始</li>
  68. <li  id="abc"  class="aaa">学设计</li>
  69. </ul>




  70. <table width="700px" border="1px" >
  71. <tr>
  72. <td class="aaa"   height="610px"> </td>
  73. </tr>
  74. </table>








  75. ----------------------------------------------------------------------

复制代码
我们来看下这些常用到的代码;用来我们学习研究,和知识点的回复!
道勤主机提供365天*24小时全年全天无休、实时在线、零等待的售后技术支持。竭力为您免费处理您在使用道勤主机过程中所遇到的一切问题! 如果您是道勤主机用户,那么您可以通过QQ【792472177】、售后QQ【59133755】、旺旺【诠释意念】、微信:q792472177免费电话、后台提交工单这些方式联系道勤主机客服! 如果您不是我们的客户也没问题,点击页面最右边的企业QQ在线咨询图标联系我们并购买后,我们为您免费进行无缝搬家服务,让您享受网站零访问延迟的迁移到道勤主机的服务!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

道勤网- 推荐内容!上一条 /2 下一条

!jz_fbzt! !jz_sgzt! !jz_xgzt! 快速回复 !jz_fhlb! !jz_lxwm! !jz_gfqqq!

关于我们|手机版|小黑屋|地图|【道勤网】-www.daoqin.net 软件视频自学教程|免费教程|自学电脑|3D教程|平面教程|影视动画教程|办公教程|机械设计教程|网站设计教程 ( 皖ICP备15000319号-1 )

GMT+8, 2024-12-18 19:14

Powered by DaoQin! X3.4 © 2016-2063 Dao Qin & 道勤科技

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