zoukankan      html  css  js  c++  java
  • CSS学习(页外引用还不懂)

    CSS的语法结构为   选择符 {属性:值;}    Selector {Property : Value;}

    选择符:通配 *{....}  , 元素  body{....} 、h1{....}、p{....}  , 群组 h1,h2,h3,p {....} 同时可一个给多个标签赋予相同的属性

               关系选择符:包含  h1 a{....} 

    【一些基本属性:文字装饰text-decoration:    字体 font-family    字体颜色 color    字体大小font-size:px;   外边距margin    内边距padding】

    CSS的引入方式用就近原则

    行内引用 (直接在标签里写入style属性)

         例如:<body style="background-color:#8484FF;">
                    <h1 style=" font-size:20px; font-family:仿宋;">在H1标签里写入style属性</h1>
                    <p style="font-size: 10px;">在P标签里写入style属性</p>
              </body>

    页内引用  (当单个文件需要特别样式时,就可以使用内部样式表)

    定义单文件个在<head> 部分通过 <style>标签定义内部样式

    例如:     <head>
                 <style type="text/css">
                      body {
                       background-color:#cccccc;
                    }
                 </style>
              </head>
                 <body>
                         <h1>这是一个H标签</h1>
    <h1>这是一个H标签</h1>
             </body>

    页外引用

    CSS的代码注释用  /* ~ */    开始~结束    /*导航开始*/  #nav{....}  /*导航结束*/

    通配选择符用 *{....}    同时定义body里所有标签的样式

              例如: <style>
                        *{
                            color:red;
                            font-family:仿宋;
                              }
                    </style>
                  </head>
                    <body>
                        <h1>标签</h1>
                        <p>第一个标签</p>
                        <p>第二个标签</p>
                        <p>第三个标签</p>
                    </body>

    元素选择符用 body{....} ,h1{....},  p{....}    选择性定义body里的单个标签样式    ( 例如我选择性的定义b标签)

            例如:<style>
                    b {
                        color:red;
                        font-family:仿宋;
                         }
                  </style>
                  </head>
                 <body>
                     <h1>标签</h1>
                     <b>第一个标签</b>
                   <p>第二个标签</p>
                     <p>第三个标签</p>
                 </body>
               </html>

    群组选择符 需要修改的标签进行挑选   例如:h1, h3, h6 {....}    选择性的定义body里的多个标签样式   (例如我选择性定义b和Pb标签,必须用逗号隔开)

          例如:<style>
                 b,p {
                  color:red;
                  font-family:仿宋;
                    }
               </style>
             </head>
             <body>
                  <h1>标签</h1>
                  <b>第一个标签</b>
                  <p>第二个标签</p>
                  <p>第三个标签</p>
             </body>
             </html>

     

    关系选择符分为4种:1.包含选择符   一个标签被另一个标签所包含,包含关系不限包含层次注意:多个选择符组成的包含选择符一定要使用空格隔开

    单用h1{....}h1标签是红色,单用em{....}p标签和h1标签的em是绿色,单用h1 em{....}则h1里面的em是绿色,p标签则没获得任何样式。

     例如:    <style>
                  h1{
                    color: red;
                    }
                  em{
                     color:green;
                    }
               h1 em{
                      color: red;
                    }
                </style>
                </head>
                <body>
                       <h1>标签</h1>
                       <b>第一个标签</b>
                       <p><em>第二个标签</em></p>
                       <p>第三个标签</p>
                       <h1>红色文字<em>绿色文字</em> 红色文字</h1>
                </body>
                </html>
  • 相关阅读:
    并发编程之进程池,线程池 和 异步回调,协程
    form与modeform
    5个_meta方法
    CRM项目知识预备
    Jason数据库查询语句
    kindeditor编辑器
    几种单例模式
    BBS项目复习
    BBS项目小组件
    BBS项目附加知识
  • 原文地址:https://www.cnblogs.com/zx192664369/p/5750212.html
Copyright © 2011-2022 走看看