#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. Bulbs【暴力？】

    问题 B: Bulbs 时间限制: 1 Sec  内存限制: 128 MB 提交: 216  解决: 118 [提交] [状态] [命题人:admin] 题目描述 Greg has an m × n ...

  2. PIL PNG格式通道问题的解决方法

    近来研究图片的剪切拼接,用到PIL,在打开PNG格式保存为JPEG格式的图片发现报错: import os from PIL import Image im = Image.open(r'E:\wor ...

  3. Linux中通过Socket文件描述符寻找连接状态介绍

    针对下文的总结:socket是一种文件描述符 进程的打开文件描述符表 Linux的三个系统调用:open,socket,pipe 返回的都是一个描述符.不同的进程中,他们返回的描述符可以相同.那么,在 ...

  4. 获取动态代理生成的.class文件

    生成代理类,并写入硬盘:配置系统属性sun.misc.ProxyGenerator.saveGeneratedFile为true,代理类生成时将自动将生成的代理类写入硬盘 ? 1 2 3 4 5 6 ...

  5. Roslyn

    Roslyn 是以 API 为驱动的下一代编译器,集成在最新版的 Visual Studio 上.它开放 C# 和 Visual Basic 编译器的 API,使得开发者可以借助编译器进行解析代码文件 ...

  6. A_Pancers团队作业4—基于原型的团队项目需求调研与分析

    任务1:实施团队项目软件用户调研活动. (1)用户调研对象:我们的项目软件是基于安卓系统的音乐播放器,以设计出操作简单的音乐播放器为目的,所以本次用户调研的对象主要以身边的老人为主,对他们听音乐,听戏 ...

  7. js获取css样式封装

    封装 function getStyle(obj , attr){ return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(ob ...

  8. Asp.net core (学习笔记 路由和语言 route & language)

    https://docs.microsoft.com/en-us/aspnet/core/mvc/controllers/routing?view=aspnetcore-2.1 https://doc ...

  9. URI和URL之间的区别

    URI的全称为统一资源标识符(Uniform Resource Identifier),是一个用于标识某一互联网资源名称的字符串. 该种标识允许用户对任何(包括本地和互联网)的资源通过特定的协议进行交 ...

  10. stylus笔记（二）

    1.方法 函数  Stylus强大之处就在于其内置的语言函数定义.其定义与混入(mixins)一致:却可以返回值. 默认参数 可选参数往往有个默认的给定表达.在Stylus中,我们甚至可以超越默认参数 ...