3.20 css样式
今天跟着老师把官网做了一下,讲的挺快,不过大部分还是能听进去,讲完完事就开始让我们自己做,我就先做我那个学校的官网,没有啥会不会得,不会就查,有书有老师有百度,所以说没啥不会的,就看你掌握的熟不熟练,总体来说我希望老师给我压力,让我们快速的学完js然后考我们css,考完再考js,这样我们才能给自己压力,知道记忆力的一重要。
现在还早,还有时间努力,继续加油吧。
内联 写在标签里面 style="样式" 控制精确,代码重用性差 内嵌 嵌在页面的head里面 <style type="text/css"></style> 控制没有内联的精确,代码重用性好 外部 单独的样式文件 引入:右键-CSS样式表-附加样式表 引入:<link href="test.css" rel="stylesheet" type="text/cs"/> 控制没有内联的精确,代码重用性最好 样式表用来选取元素的 标签 根据标签名选中元素 class . (点) 根据class名来筛选元素 id # (井号) 根据id名来筛选出唯一元素 不能使用数字开头(中文开头) 复合 逗号并列 div,span 空格后代 #list li 点筛选 div.s 标签>*,class>标签,id>class 大小 width 宽度 height 高度 背景 background-color 背景色 background-image 背景图片 background-repeat 背景图的平铺方式 background-position 背景图片位置 background-attachment 设置背景图片是否滚动 background-size 背景图的大小 200px 200px 字体 font-family 字体样式 font-size 字体大小 12px 14px font-style italic倾斜 font-weight bold加粗 text-decoration underline下划线 overline上划线 line-through删除线 none没有,用来去掉超链接的下划线 <a><span>默认没法调整大小 color 字体颜色 对齐方式 text-align 水平对齐方式 vertical-align 垂直对齐方式,配合行高使用 line-height 行高 text-indent 缩进 单位像素 边界边框 margin 外边距 上右下左(所有的外面) padding 内边距 上右下左 (嵌套的里面的和外面的距离) 如果加了内边距,该元素会相应的变大 border 1px solid #60F 简写方式 第一个边框粗细 第二个边框样式 第三个边框颜色 列表方块 list-style none将列表前面的序号去掉;inside是点在里面;outside是点在外面 list-style-image 可以将前面的序号变为图片 格式与布局 位置 position 不占位 fixed固定 相对于浏览器边框位置固定 absolute绝对位置 相对于父级元素(浏览器,绝对定位的上级) relative相对位置 相对于自身应该出现的位置 top 距离上边的距离 right 距离右边的距离 bottom 距离下边的距离 left 距离左边的距离 流 float left 向左流 right 向右流 clear both 清掉流 z-index分层 值越大越靠上 其它 display 显示block和隐藏none,不占位置 visibility 显示visible和隐藏hidden,占位置 overflow 超出范围 hidden隐藏 透明 opacity:0.5;-moz-opacity:0.5;filter:alpha(opacity=50) 圆角 border-radius:5px; 阴影 box-shadow:左20px 上20px 羽化10px white; hover 鼠标颜色
样式表一些代码,抄袭备注。