• CSS基础知识


    CSS:层叠样式表  用于美化页面,修改标签样式

    排版专用标记:<div>与<span>

    这两个标签都是用来设置涵盖一个区块为主.区块就是表示一行 以上的数据.如果没有一样,则<span> 与</span>该数据显示前后都不会跳行.

    写法分类:

    1、内联写在标签里面,以属性的形式表现 属性名style

    格式:<标记名称 style=”属性1:属性值1;属性2:属性值2”>…</标记名称>

    例  :

    <p style=”font-size:20pt;color:red;text-align:center”>排版样式</p>

    2、内嵌写在head标签中,以标签的形式表现 标签名style

    内嵌式排版中所有的样式定义都必须在<style>..</style>之间,而<style>..</style>又必须在<head>..</head>之间.

    格式:   <head>

                       <style> 

                            选择器  

                        </style> 

                </head>

     选择器:通过各种方式找元素,例如:标签名 id属性值

    选择器格式:

    选择器{

      样式属性:样式值;

      样式属性:样式值;

     }

     选择器类型: 

    1、通用选择器:  *{}

     

    所有标签都需要用该选择器的属性,包括<head>、<body>

     

    一般不常用,只有几个样式属性:

    2、标签选择器: 标签名{}

    <head>
        <style type=”text/css”>
            标记名称{属性1:属性值1;属性2:属性值2;}
            标记名称{属性1:属性值2;属性2:属性值2;}
        </style>
        </head>
        <body>
            <标记名称>…</标记名称>
        </body>

    以<body>内的标签名称为选择器,具有不唯一性,所有用该标签的内容都包括

     

    3、Id选择器:   #id属性值{}

     

    <head>
        <style type="text/css">
            #定义名称{属性1:属性值1;属性2:属性值2;}
        </style>
        </head>
        <body>
            <标记名称 id=”定义名称”>…</标记名称>
        </body>

     

    在<body>内的标签名中,定义id属性,以#id属性值为选择器,具有唯一性,id 在 HTML 文档中必须是唯一的。

     

     

    4、Class选择器:.class属性值{}    

     

    <head>
        <style type=”text/css”>    
            .定义名称1{属性1:属性值1;属性2:属性值2;}
        </style>
        </head>
        <body>
            <标记名称 class=”定义名称1 定义名称2”>…</标记名称>
        </body>

     

    在<body>内的标签名中,定义class属性,以.class属性值为选择器,不具备为一性

     

     

     一个 class可以有多个class值,以空格分开,以优先值确定以哪个为准。

    组合选择器

     

    5、后代选择器:   选择器1  选择器2{}  (所有内嵌,只要是选择器2 的)

    选择器1和选择器2间加空格,予以筛选,表示符合选择器1后代的所有选择器2的内容

     

     

    6、子类选择器:    选择器1>选择器2{}

    与后代选择器不同,只筛选选择器1的子类中的内容

     

     

    7、并列选择器:   选择器1,选择器2,选择器3,,,,{}

    多个选择器间用逗号分开,表示并列的选择器都有效

     

     

    8、伪类选择器:    选择器:伪类

     

    9、根据属性:    选择器[属性=”属性值”]{}

     

    根据选择器内的某标签的属性值确定内容

     

     

    3、外部引用:引入外部文件

       写在head标签中,以标签的形式表现,标签名 link

    <link rel="stylesheet" href="css.css">

    在css.css页面中直接输入选择器,不用加style

    html中:

    <head>
        <link rel=”stylesheet” type=”text/css” href=2.css>
    </head>
    <body>
    <h1>这是一个标题<h1>
    <h1 id="color">这是一个标题<h1>
    </body>

    css中

    #color{
    color:red
    }

    优先级概念

    权值越高,优先级越高,显示优先级高的设置

    写法 权值
    内联(行内) 1000
    id 100
    class 10
    标签名 1
    通用* 0

                 

     

    并列选择器,权值可叠加。

     

  • 相关阅读:
    jsp小测文件上传+servlet+分页 47/32(继续努力!)
    使用分层实现业务处理
    jsp 2018年5月7日11:04:15题库52/34
    jsp题库 (一)小测(25/21)
    Js2云题库,好题就得藏起来
    Jsp前2纠错
    【转】js限制用户上传文件类型
    【转】HTML from enctype 定义和实例
    fmt jstl标签 时间格式化例子
    【转】hibernate中lazy的使用
  • 原文地址:https://www.cnblogs.com/dk2557/p/9146133.html
Copyright © 2020-2023  润新知