前端学习(二）css样式笔记（笔记）

background-image:url(img/xiaofeiji.jpg)
背景图：url（图片路径）；（背景图默认平铺）

background-repeat:repeat-x/repeat-y/no-repeat;
背景重复状态：x轴/y轴/不重复；

background-position:100px 10px;---数字写法
背景图定位：居左100px  居上10px
background-position:top right;----单词写法

background-position:center center;-----居中

背景图缩写：
background:url(img/xiaofeiji.jpg) no-repeat top left yellow；

background:背景图片  重复状态  位置  背景颜色；

****
background:背景图片  重复状态  位置；

讲一些关于文字样式：
    
    color:red;
    字体颜色

font-weight:bold/normal;（500以上是加粗，500以下变细）
    字体粗细：加粗/变细;

font-size:14px;(网页中默认的字体大小16px，网页中字体最小是12px)
    字体大小:14px;

font-family:'微软雅黑';
    字体库：

font-style:italic/normal;
    字体倾斜：倾斜/不倾斜

text-decoration:none/underline/line-through/overline;
    文本状态：没有划线/下划线/中划线/上划线；

text-indent:2em;-----em单位（1em就是一个字的大小）
    文本缩进：2em

功能：1.文本缩进
              2.隐藏文字

text-align:center/left/right;
     文本左右位置：居中/居左/居右

line-height:65px;
    行高：65px；（如果想让某段文字在100px高度居中那么就写line-height:100px;）

=================================================
实体字符：
    空格：   

----------------------------------------------

调试页面：

-----------------------------------------------
ps

挖空一个图片

快捷键：
    f7 图层
    W    魔棒工具
步骤：
    1.选中魔棒工具
    2.点击需要挖空区域（系统默认会选中这写区域）
    3.点击按钮delete，删除掉选中的区域
    4.一次重复操作

图片格式：区别

jpg   不支持透明 质量较好  新闻图片

png   支持透明和半透明 质量好 产品图片 logo

gif      支持透明、不支持半透明 一般  表情 小动态图标

--------------------------------------------------

新标签：
    
    b ---默认有加粗效果
    strong----默认加粗效果（语义化功能）

i----默认是倾斜效果
    em---默认是倾斜效果（语义化功能）

font-style:italic;

注意：
    在程序当中，所有有默认样式的标签，都要清除掉它们默认样式！！！

===============================================

继承：
    子级标签可以继承父级标签的字体方面样式！

写页面的方法：
    1.从大到小
    2.从上到下