day03

2017-10-27  本文已影响0人  Rosemarry丶

A我今天学了什么

1css背景

1.背景图片:background-image:url(“”)
2.背景颜色:background-color
3.背景重复:background-repeat
4.背景吸附:background-attachment:fixed(固定) :scroll(滚动)
5.背景位置:background-position:x,y(背景位置有两个参数,第一个参数表示离x轴的距离,
y表示离y轴的距离),简写background:color image repeat position
6.background-size 属性指定背景图片大小
background-size:x,y;
x表示宽度,y表示高度
background-size:cover;
此时会保持图像的纵横比并将图片缩放成将完全覆盖背景定位区域的最小大小
相当于background-size:100%,100%;

1.2文本

1.color:设置字体的颜色
颜色的名称 如:red
颜色是通过css最经常指定:
十六进制  如:#FF000
一个RGB值 如:RGB(255,0,0)
body{color:red;}
h1{color:#FF000;}
h2{color:rgb(255,0,0);}
2.text-align文本对齐方式
text-align:right,left,center
3.text-decoration 文本修饰:underline(下划线) :overline(上划线) :line-through(删除线)
4.text-transform文本修饰:appercase(字母全小写):lowercase(字母全大写):capitalize(首字母大写)
5.text-indent (文本缩进) em 取决于父级字体大小

1.3css字体

1.font-famliy属性应该设置几个字体名称作为一种“后备”机制,如果浏览器不支持第一种字体,他将尝试下一种字体
2.font-style(字体样式) normal(正常),italic(斜体)
3.font-size(字体的大小)最小为12px,视浏览器而定
4.font-weight(字体粗细)normal(正常) bold(粗) lighter(细)
5.line-height(行高)

1.4css链接

1.a:link-正常,未访问过的链接
2.a:visited-用户已访问过的链接
3.a:hover-当用户鼠标放在链接上时
4.a:active-链接被点击的那一刻
*若单独设置几个链接,必须遵守以下规则:
a:hover必须跟在a:link和a:visited后面
a:active必须跟在a:hover后面

1.5 列表样式(针对ul)

1.list-style:none;(清除列表样式)
2.list-style-type:(改变li前点的样式)
3.list-style-image:url(“xx”)(可以用图片代替li的点)

1.6边框

1.border-width(边框的宽度)
2.border-style(边框的样式)
3.border-color(边框的颜色)
可以简写为:border:width style color
p{border:1px solid #333}
*边框单独设置各边
p{
border-top-style-solid;
border-right-style:solid;
}

1.7表格

1.border-collapse(属性设置表格的边框被折叠成一个单一的边框)
2.table{border-collapse:collapse}//边框折叠
3.可以在td,th中设置这两个属性
colspan:value(值,数字)//跨越的列
rowspan:value//跨越的列
例:<th colspan="2">xx</th>

B我今天掌握了什么

css背景基本都掌握了,背景吸附不太熟悉
css文本基本掌握,但还不是太熟练
css字体都掌握
css链接都掌握
列表样式基本掌握
边框基本掌握

C我今天掌握不好的地方

背景吸附
表格还不太熟悉
上一篇下一篇

猜你喜欢

热点阅读