• css样式表


    样式表:

        一。内联:写在body中    直接在内容的标签中添加style属性:例如<div style="...">1234</div>

       二。内嵌:写在head中   一般写在标题标签的后面,添加<style type="text/css"></style>标签,p为需要改变的标签

                     

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    
    <style>       /*style是双标签元素*/
    p{
    	background:#000}
    
    </style>
    

      三。外部样式表:新建一个css文件

                               在文件中右键,选择css样式,附加样式表。添加入之前新建的样式表。保存之后会出现一组link开始的标签

    选择器:

    1. 用标签做选择器:方法:以p标签为例,p{}

    <style>
    p{            /*所有P标签改变的背景颜色*/
    	background:#000}
    
    </style>
    

    2.class选择器:class的值可以相同,以"."开头<head>

    <style>
    .a{                   /*执行所有class的值为a的标签,改变属性*/
    	background:#9C0}
    </style>
    </head>
    
    <body>
    
    <p class="a"></p>    /*定义p标签的属性为a*/
    <div></div>
    </body>

    </html>

    3.id选择器:id的值不能重复,以"#"开头

    <head>
    <style>
    #a1{                      /*id的值为a1的标签所包括的内容,改变属性*/
    	background:#000}
    </style>
    </head>
    
    <body>
    
    <p id="a2"></p>
    <p id="a1"></p>             /*定义该p标签的id为"a1"*/
    </body>
    

    4.复合选择器:

    (1)用逗号隔开,表示并列

    <head>
    <style>
    div,p{                    /*所有div和p标签均执行此操作*/
    	background:#093}
    </style>
    </head>
    
    <body>
    <div></div>                 /*执行该标签,改变其背景颜色*/
    <p></p>                       /*执行该标签,改变其背景颜色*/
    <p></p> /*执行该标签,改变其背景颜色*/
    </body>

    (2)用空格隔开,表示后代 需要有包含关系

    <head>
    <style>
    div p{                                    /*在div中的p标签,所执行的属性*/
    	background:#093}
    </style>
    </head>
    
    <body>
    <div></div>
    <p></p>
    <p></p>
    
    <div>
    <p></p>                  /*执行该标签,改变其背景颜色*/
    </div>
    </body>

    (3)筛选:

    <head>
    <style>
    p.a3{                      /*在所有p标签中,只执行klass的值为a3标签*/
    	background:#633}
    </style>
    </head>
    
    <body>
    <div></div>
    <p></p>
    <p></p>
    
    <div>
    <p class="a4"></p>
    <p class="a3"></p>       /*执行该标签,改变其背景颜色*/
    </div> </body>

      

    我们不是制造者,我们是代码搬运工
  • 相关阅读:
    .net core web api swagger 配置笔记
    mvc下ajax请求遇到session超时简单处理方式
    sql ltrim/rtrim 字段中为中文时出现?的问题
    SQL 将一个字段内用逗号分隔的内容分成多条记录
    bootstrap下modal模态框中webuploader控件按钮异常(无法点击)问题解决办法【转】
    mvc 封装控件使用mvcpager
    uploadify在chrome下初始化失败,在Firefox下却可以原因探析
    MVC FormCollection 无法获取值的问题
    linq to sql之like
    mvcpager 表单提交时无法获取pageindex的值
  • 原文地址:https://www.cnblogs.com/zhaotiancheng/p/6080351.html
Copyright © 2020-2023  润新知