#p1{
/*        border-width: 1px;*/
        /*边框实线*/
        /*border-style: solid;*/
        /*边框虚线*/
        /*border-style: dashed;*/
        /*边框点线*/
        /*border-style:dotted;*/
        /*边框双线*/
        /*border-style:double;*/
        /*边框颜色*/
        /*border-color: red;*/
        /*简单写法*/
/*        border: 1px dotted orange;*/
        border-bottom: 1px dotted #A2A0A0;
        border-left: 2px double red;
        /*背景颜色*/
/*        background-color: blue;*/
        background-image: url(img/a.jpg);
        /*背景图位置        */
        background-position: -30px -500px;
    }    
  元素标签引用案例

li{
        border-bottom: 1px dotted yellow;
    }
    body{
        background-image: url(img/2.png);
        background-repeat: repeat-y;
        background-attachment: fixed;
    }

<ul  type="dis">
        <li>选项一</li>
        <li>选项二</li>
    </ul>

CSS图片位置的调整 案例
<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<style>

    #in1{

        background-image:url(img/bg.png);

        background-position: -247px -90px;

        text-indent: 25px;

    }

</style>

</head>

<body>

    <input type="text" id="in1">

</body>

</html>
给文字添加触碰效果，点击后效果，移动到效果

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>伪类</title>

    <style>

        /*未访问的样式*/

        #a1:link{

            text-decoration: none;

            color: red;

        }

        /*访问后的样式*/

        #a1:visited{

            color: yellow;

        }

        /*鼠标悬浮时的样式*/

        #a1:hover{

            color:#666666;

        }

        /*点击时的样式*/

        #a1:active{

            color:blue;

        }

        /*hover可以用在任意标签*/

        #p1:hover{

            color: pink;

        }

    </style>

</head>

<body>

      <a href="#" id="a1">百度</a>

      <p id="p1">这是p标签</p>

<a href="#" style="text-decoration: none;">去下划线超链接样式</a>

</body>

</html>
有序列表无需列表用CSS样式快速编辑

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<style>

    ul li{

        /*list-style-type: circle;*/

        list-style-image: url(img/sp.png);

    }

    ol li{

        list-style-type: lower-alpha;

    }

</style>

</head>

<body>

    <!--无序列表-->

    <ul>

        <li>语文</li>

        <li>数学</li>

        <li>英语</li>

    </ul>

    <!--有序列表-->

    <ol>

        <li>美术</li>

        <li>体育</li>

        <li>艺术</li>

    </ol>

</body>

</html>

CSS样式补充第二天的更多相关文章

  1. CSS样式补充代码

    CSS符号属性: list-style-type:none; /*不编号*/ list-style-type:decimal; /*阿拉伯数字*/ list-style-type:lower-roma ...

  2. CSS样式表-------第二章：选择器

    二 .选择器 内嵌.外部样式表的一般语法: 选择器 { 样式=值: 样式=值: 样式=值: ...... } 以下面html为例,了解区分一下各种样式的选择器 <head> <met ...

  3. html学习第二天—— 第七章——CSS样式基本知识

    外部式css样式,写在单独的一个文件中外部式css样式(也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以“.css”为扩展名,在<head>内(不是在<s ...

  4. HTML第二部分 CSS样式表

    CSS(cascading style sheets,层叠样式表),作用是美化HTML网页. /*注释*/   注释语法 2.1 样式表的基本概念 2.1.1样式表的分类 1.内联样式表 和HTML联 ...

  5. 11-19网页基础--第二部分CSS样式表基本概念

    CSS,全称(Cascading Style Sheets,层叠样式表),作用是美化HTML网页. 一.基本概念:是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言. 你可能对C ...

  6. 网站开发综合技术 第二部分 CSS样式表

    第2部分 CSS样式表 CSS(Cascading Style Sheets,层叠样式表),作用是美化HTML网页. /*注释*/    注释语法 2.1.样式表的基本概念 2.1.1.样式表分类 1 ...

  7. CSS样式----图文详解：css样式表和选择器

    主要内容 CSS概述 CSS和HTML结合的三种方式:行内样式表.内嵌样式表.外部样式表 CSS四种基本选择器:标签选择器.类选择器.ID选择器.通用选择器 CSS三种扩展选择器:组合选择器.后代选择 ...

  8. css样式兼容不同浏览器问题解决办法

    在网站设计的时候,应该注意css样式兼容不同浏览器问题,特别是对完全使用DIV CSS设计的网,就应该更注意IE6 IE7 FF对CSS样式的兼容,不然,你的网乱可能出去不想出现的效果! 所 有浏览器 ...

  9. CSS样式----CSS的继承性和层叠性（图文详解）

    CSS的继承性 我们来看下面这样的代码,来引入继承性: 上方代码中,我们给div标签增加红色属性,却发现,div里的每一个子标签<p>也增加了红色属性.于是我们得到这样的结论: 有一些属性 ...

随机推荐

  1. TensorFlow和Keras完成JAFFE人脸表情识别

    cut_save_face.py #!/usr/bin/python # coding:utf8 import cv2 import os import numpy as np import csv ...

  2. sony Z5P 刷rec、root的方法

    想root需要刷第三方recovery,刷recovery需要先解锁.但如果直接解锁,会丧失相机算法.屏幕超逼真模式,所以不能直接来. 大体步骤就是解完锁后自己做个内核刷进去,欺骗系统让他觉得没解锁. ...

  3. SpringBoot 配置阿里巴巴Druid连接池

    在Spring Boot下默认提供了若干种可用的连接池(dbcp,dbcp2, tomcat, hikari),当然并不支持Druid,Druid来自于阿里系的一个开源连接池,它提供了非常优秀的监控功 ...

  4. CTime格式化

    CTime Formateg://CString date = time.Format("%Y-%m-%d %H:%M:%S %W-%A");格式符号说明 %a —— 星期(缩写英 ...

  5. 函数, arguments对象, eval,静态成员和实例成员

    函数创建: 3种创建函数的方式    * 直接声明函数 function funcName(/*参数列表*/){ //函数体 } * 函数表达式 var funcName = function(){ ...

  6. CentOS7下swap分区创建(添加),删除以及相关配置

    在添加swap分区之前我们可以了解下当前系统swap是否存在以及使用情况,可用: 1. free –h 或 swapon –s 了解硬盘使用情况(一般/dev/vda1为挂载硬盘): 1. df –h ...

  7. LoadRunner遇到的错误及解决方法

    1.返回的报文太长: intweb_set_max_html_param_len(const char * length); intweb_set_max_html_param_len(") ...

  8. request.getRealPath的替代方法

    在写上传小练习的时候,发现获得路径的request.getRealPath("")已经被画上线了,也就是不再建议使用. package controller; import jav ...

  9. Python之路-文件操作（py3）

    文件操作的基本步骤: 1.打开文件:f=open('filename'),with open('filename') as f 2.操作文件:增,删,改,查 3.关闭文件:f.close 打开文件 p ...

  10. day41-python多进程多线程-多线程共享

    线程共享变量多线程和多进程不同之处在于多线程本身就是可以和父进程共享内存的,这也是为什么其中一个线程挂掉以后,为什么其他线程也会死掉的道理. import threading def worker() ...