一、CSS

JAVA WEB之CSS

二、CSS和html的结合方式

 (1)、在每个html标签上都有一个style属性,把css和HTML结合在一起    JAVA WEB之CSS

 (2)、使用HTML的<style>标签,写在head里面

       格式:<style  type=”text/css”>

</style>

     JAVA WEB之CSS

(3)、在style标签里面 使用语句

格式:@import  url(css文件的路径)

-第一步,创建一个css文件

 

JAVA WEB之CSS

-在HTML中

JAVA WEB之CSS

(4)、使用头标签link,引入外部css文件

JAVA WEB之CSS

****第三种方式,在某些浏览器版本中不起作用,一般使用第四种

 

三、CSS的优先级

    JAVA WEB之CSS

css的基本选择器(3种)

  **要对那个标签里面的数据进行操作

(1)标签选择器

  ---使用标签名称作为选择器

div{

   background-color:gray;color:white;

}

 ----class选择器

 *每个html标签都有一个class属性

JAVA WEB之CSS

JAVA WEB之CSS

-----id选择器

  *没个html标签上都有一个属性 id

   -<div  id=”  ”>

JAVA WEB之CSS

 

基本选择器的优先级:

    style > id选择器>class选择器>标签选择器

四、CSS拓展选择器

JAVA WEB之CSS

(1)关联选择器

   **<div><p>wwwwwwwwwwwwwww</p></div>

 

JAVA WEB之CSS

   (2)组合选择器

   JAVA WEB之CSS

(3)伪元素选择器

      *css里面定义好的一些样式,可以直接用

    *比如超链接

        原始状态  鼠标放上去的状态(悬停状态)  点击状态  点击之后的状态

        :link        :hover                     :active       :visited

JAVA WEB之CSS

五、css的盒子模型

    JAVA WEB之CSS

 

   JAVA WEB之CSS

 

JAVA WEB之CSS

JAVA WEB之CSS

JAVA WEB之CSS

6、csss布局的漂浮

JAVA WEB之CSS

JAVA WEB之CSS

7、css布局的定位

JAVA WEB之CSS

JAVA WEB之CSS

相关文章:

  • 2021-12-03
  • 2021-12-10
  • 2021-12-27
  • 2021-08-17
  • 2022-01-10
  • 2021-11-30
  • 2021-08-04
猜你喜欢
  • 2021-07-30
  • 2021-05-12
  • 2021-08-25
  • 2021-11-09
  • 2022-12-23
  • 2022-12-23
相关资源
相似解决方案