#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. CSDN不登录阅读全文（最新更新

    CSDN真的烦...然而没卵用 用stylus加两行css就行了: .article_content{height:auto!important} .hide-article-box{display: ...

  2. JS对象、数据类型区别、函数

    对象 基本数据类型都是单一的值,值和值之间没有任何联系,变量之间独立,不能成为一个整体. 对象属于一种符合的数据类型,对象中可以保存对个不同数据类型的属性. 对象分类:  1.内建对象   由ES标准 ...

  3. Signal in unit is connected to following multiple drivers VHDL

    参考链接 https://blog.csdn.net/jbb0523/article/details/6946899 出错原因 两个Process都对LDS_temp进行了赋值,万一在某个时刻,在两个 ...

  4. 组合，多态与多态性，封装以及property装饰器介绍

    一:组合: 什么是组合:组合指的是某一个对象拥有一个属性,该属性的值是另外一个类的对象. 为何要用组合:通过为某一个对象添加属性(属性的值是另外一个类的对象)的方式,可以间接地将两个类关联/整合/组合 ...

  5. Linux之文件目录

    一.Linux的目录结构 1.概览 2.树状目录结构 说明: /root:该目录为系统管理员用户主目录 /bin:即Binary,存放着系统必备执行命令 /boot:这里存放的是启动Linux时使用的 ...

  6. [easyUI] 列表

    一. 简述: 对一个层级的ul/ol进行调用menu()函数,即可简单做成层叠列表. 二. 实例: <ul id="menu3"> <li>Menu1 &l ...

  7. Hadoop启动之后jps没有NameNode节点

    这是因为多次格式化namenode节点出现的问题 1.先运行stop-all.sh 2.删除原目录,即core-site.xml下配置的<name>hadoop.tmp.dir</n ...

  8. Innodb中的行锁与表锁

    在Innodb引擎中既支持行锁也支持表锁,那么什么时候会锁住整张表,什么时候或只锁住一行呢? InnoDB行锁是通过给索引上的索引项加锁来实现的,这一点MySQL与Oracle不同,后者是通过在数据块 ...

  9. JQuery的常用选择器

    刚开始学JQuery写的如有错误欢迎批评指正 JQuery拥有的选择器可以让我们更快更方便找到想要的元素,然后对相应的元素进行操作 简单介绍一下一些常用的选择器: 1.基本选择器: 标签名选择器: $ ...

  10. FTP:500 OOPS: failed to open vsftpd log file:/var/log/vsftpd.log

    如下:从10.12.8.165 FTP 到 10.1.3.34,报failed to open vsftpd log[a4_csbdc@localhost ~]$ ftp  10.1.3.34Conn ...