首页 > 代码库 > 随笔-1031
随笔-1031
随笔1030 学习第四天 样式表的样式 一、大小 宽度width 高度height 二、背景 1.background-color 背景色 2.background-image 背景图片 3.background-repeat:no-repeat 背景图的平铺方式 4.background-position 背景图的位置 center等 5.background-attachment 背景图是否滚动 6.background-size:..px ..px; 背景图片大小 三、字体 1.font-family 字体样式,通常以宋体、仿宋、微软雅黑为主 2.font-size 字体大小 以12px、14px为主 3.font-style:italic 倾斜 4.font-weight:bold 加粗 5.color 直接定义字体颜色 6.text-decoration:underline 下划线 overline 上划线 line-through 删除线 none 去掉样式,多用于<a></a>的下划线 四、对齐方式 1.text-align 水平对齐 2.vertical-align 垂直对齐方式 3.line-height 行高 2 3配合使用用于对齐文字 4.text-indent 缩进 以像素为单位 五、边界边框 1.margin 外边距 顺序为上右下左 2.padding 内边距 使用padding时,自身会变大,需要做完减去变大的大小 此时需要注意: margin与padding的区别 margin与padding都是作用于要移动的物体,margin是距离外部的距离,padding是本身与自身内部物体的距离 例:方块1里面有个方块2,方块2内有方块3,此时让2距离1多少距离就要对2进行编辑margin,让2内的3距离2多少距离就要进行编辑padding。 !!!! *{ margin:0px auto; padding:0px;} 页面都需要添加此项内容保证整个页面的布局方式 3.border 边框 border: 1px solid #60F 第一个代表边框粗细,第二个代表边框样式,第三个是边框颜色 可以用来做三角 六、列表方块 1.list-style:none 去掉列表的符号,若有*{ margin:0px auto; padding:0px;} 则不显示列表符号了 2.list-style-image: 将序号变成图片 七、格式与布局 1.位置 position:fixed 固定位置,固定于浏览器的位置,滚动页面位置依然在浏览器固定位置 position:absolute 绝对位置,固定在父级元素之上, 固定在浏览器上,页面具体位置 position:relative 相对位置,相对于原来定义的位置 2.流 float:left/right 向左向右流,写完之后要清除流<div style="clear:both"></div> 3.z-index 分层, 值越大越靠上 八、其他 1.display display:block(显示)/none(隐藏) 不占位置 2.visibility:visible(显示)/hidden(隐藏) 占位置 3.overflow:hidden 超出部分隐藏 4.透明 opacity:0.5;-moz-opacity:0.5;filter:alpha(opacity=50) 5.圆角 border-radius:5px; 6.阴影 box-shadow:0 0 5px white;
随笔-1031
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。