css笔记

  1 css注释
  2 /*   */
  3 
  4 css样式使用方式：
  5 1.head中放style标签(内部)
  6 <style>
  7     span{
  8             font-size:50px;
  9 }
 10 </style>
 11 
 12 2.在标签身上加style属性(内联)
 13 <span style="font-size:50px;">aaa</span>
 14 
 15 3.专门写个.css文件(外部)
 16 <link rel="stylesheet" href="" />
 17 .css文件中直接写style标签中间的东西
 18 
 19 css优先级：
 20 1.内联
 21 2.内部或者外部
 22 注：谁离标签近谁优先级高
 23 
 24 css长度:
 25 1.px像素
 26 2.em倍数
 27 
 28 css颜色:
 29 1.#ffffff
 30 2.red,green,blue
 31 
 32 css选择器:
 33 1.标签选择器
 34 *{} //所有标签
 35 span{}
 36 2.
 37     .scls{
 38     font-size:1em;
 39     color:blue;
 40 }
 41     <span class="scls" id="sid"></span>
 42     
 43 3.组合用，隔开
 44     span,.scls{
 45     font-
 46 }
 47 4.#div2 h1{}
 48 
 49 ====================
 50 css样式
 51 1.字体
 52 font 
 53 font-family字体类型(宋体)
 54 font-size:30px
 55 font-weight:bold;//加粗
 56 font-style:normal|italic//斜体
 57 color:
 58 
 59 2.div块
 60 width
 61 height
 62 标准宽度:960-990!!!!!!!!!!!!!!!!!设宽不设高
 63 !!!!!!
 64 background-color:
 65 background-image:url("")
 66 background-repeat:no-repeat | repeat-x//不重复|x轴平铺
 67 background-position:先x后y----top|center|buttom    left|center|right
 68 background-attachment:scroll|fixed//是否跟着页面滚动
 69 
 70 text-decoration:none;
 71 没有下划线
 72 text-align:center//文字对齐
 73 line-height:50px;//行高 设置文字垂直居中
 74 text-indent: //首行缩进
 75 
 76 word-break:break-all;//碰到墙壁(div)折行
 77 letter-spacing://字间距
 78 word-spacing://词间距
 79 
 80 光标属性:
 81 cursor: pointer(小手)|wait|help
 82 
 83 边框属性:
 84 border:5px solid//实线 red
 85 每个body都有初始边框，要想顶左上角，必须*{
 86 margin:0px;
 87 padding:0px;
 88 }
 89 
 90 border-top||-left||-bottom|-right
 91 去除ul li的小点点 ul{list-style-type:none;}
 92 li{
 93     folat:left;//横着
 94     margin-right:100px;
 95 
 96 }
 97 border-style:none|dashed|solid|double|inset|outset
 98 
 99 margin:0px;
100 padding:0px;
101 
102 本来消失的:display:none;
103 
104 菜单鼠标一扫过 弹出底下的菜单 离开关闭
105 $("dt").mouseenter(function()
106 {
107     $(this).nextALL("dd").show();
108 });
109 $("dl").mouseleave(function()
110 {
111     $(this).children("dd");
112 });
113 详情见视频 css边框、光标 58分钟
114 
115 min-width://最小宽度
116 
117 textarea文本框:
118 resize:none;//不出现拖动的框
119 
120 定位：
121 div居中
122 margin-left:auto;
123 margin-right:auto;
124 or
125 margin:0 auto//0是上下   auto是左右
126 margin:上右下左
127 
128 position:absolute;绝对定位
129 top: px;
130 left: px;
131 position:relative;
132 
133 z-index:  数字越大越高
134 
135 
136 
137 漂浮:
138 float:left
139 
140 overflow:visible|auto//滚动条
141 
142 显示:
143 display:block;
144 visiblity:visible;
145 
146 隐藏:
147 占位隐藏:
148 visibility:hidden;
149 不占位隐藏:
150 display:none;