day07

A.今天学到了什么

1.实现一个下拉菜单(运用知识点float,position)

    

        
首页
            

                
个人中心
                
购物车
            
        
        
菜单
        
卖家中心
    

width的继承问题

给父级相对定位,子级绝对定位，子级不会继承父元素的宽度

css3常用样式的讲解

1.边框border-radius 可以将边框设置为圆角

border-radius:value :四个边都会改变

可以单独改变一边

1.border-top-left-radius: value;

2.border-top-right-radius:value;

3.border-bottom-left-radius:value;

4.border-bottom-right-radius:value;

2.box-shadow可以给元素添加阴影

h-shadow
//必需 水平阴影的位置。允许负值。

//必需。垂直阴影的位置。允许负值。

blur
//可选。模糊距离。

spread
//可选。阴影的尺寸。

color
//可选。阴影的颜色

inset
//可选。将外部阴影 (outset) 改为内部阴影。

以上可以合写为：
box-shadow:h-shadow v-shadow blur spread  color inset;

3.文字效果//设置文字的阴影

2.3.1text--shadow:h-shadow v-shadow blur color;（！用的不多）

2.3.2text--shadow：文字溢出属性指定如何显示溢出内容

p{
overflow:hidden;
text--shadow：ellipsis;
//文字阴影：省略
white-space:nowrap;
//文字不换行
//white-space指定文字是否换行
}

B我今天掌握了什么

1.实现一个下拉菜单(运用知识点float,position)

    

        
首页
            

                
个人中心
                
购物车
            
        
        
菜单
        
卖家中心
    

width的继承问题

给父级相对定位,子级绝对定位，子级不会继承父元素的宽度

css3常用样式的讲解

1.边框border-radius 可以将边框设置为圆角

border-radius:value :四个边都会改变

可以单独改变一边

1.border-top-left-radius: value;

2.border-top-right-radius:value;

3.border-bottom-left-radius:value;

4.border-bottom-right-radius:value;

2.box-shadow可以给元素添加阴影

h-shadow
//必需 水平阴影的位置。允许负值。

//必需。垂直阴影的位置。允许负值。

blur
//可选。模糊距离。

spread
//可选。阴影的尺寸。

color
//可选。阴影的颜色

inset
//可选。将外部阴影 (outset) 改为内部阴影。

以上可以合写为：
box-shadow:h-shadow v-shadow blur spread  color inset;

3.文字效果//设置文字的阴影

2.3.1text--shadow:h-shadow v-shadow blur color;（！用的不多）

2.3.2text--shadow：文字溢出属性指定如何显示溢出内容

p{
overflow:hidden;
text--shadow：ellipsis;
//文字阴影：省略
white-space:nowrap;
//文字不换行
//white-space指定文字是否换行
}

C今天没有掌握的

没有