简易的CSS学习总结

CSS的代码内容，其实就类似于其他高级语言中的class类，它就是仅仅起到一个修饰作用，而且所有HTML的代码都能调用这个类。

在做大作业时，我碰到过一个问题就是，在页面中部署一个音频或视频时，那个原始的界面过于丑陋，于是想着用CSS去修饰，但是，后面还要用到JS的东西，于是这个想法就不了了之了。

以下是部分代码：

#show_in{

position:absolute;

bottom:0px;

left:0px;

width: 100%;

height: 60px;

border: 1px solid red;

}

#playaudio{

position:absolute;

bottom:0px;

left:0px;

opacity: 0.9;

width: 100%;

height: 60px;

background-color:#404040;

border: 1px solid black;

box-shadow: 0px 0px 10px black;

 

}

#list_s{

position: absolute;

width: 300px;

height: 300px;

border: 1px solid red;

transform:translate(900px,-300px);

background-color:#404040;

border: 1px solid black;

box-shadow: 0px 0px 10px black;

z-index: -1;

}

然后在学习过程中，那个“定位”的知识确实有点绕，position属性用于对元素进行定位。该属性有以下一些值：

• static 静态
• relative 相对
• fixed 固定

• absolute 绝对

设置了元素的position属性后，我们才能使用top, bottom, left, right属性，否则定位无效。

我记得老师提过一个问题，就是怎么做到一个元素在滑动页面时，它跟着页面一起滑，并且点击该元素时，它能回到最顶端，当时不知道做，但是现在已经知道，它其实就是做一个<href=#>，然后在CSS那里添加一个属性fixed。

以上便是大致的总结体会。