CSS（Cascading Style Sheep 叠层样式表，作用是美化HTML网页）/*注释内容*/ 为注释的方法。

样式表的分类：

1.内联样式表

　和HTML联合显示，控制精确，但是可重用性差，冗余较多。

　　例：<p style="font-size:14px;">内联样式表</p>

2.内嵌样式表

　作为一个独立区域内嵌在网页里，必须写在head标签里面。

　　<style type="text/css">

　　p   //格式对p标签起作用

　　{

　　样式；

　　}

　　</style>

3.外部样式表

　新建一个CSS文件，用来放置样式表。如果要在HTML文件中调用样式表，需要在HTML文件中点右键→CSS样式表→附加样式表。一般用link连接方式。

　　有些标签有默认的边距，一般写样式表代码的时候都会先去除（也可以设置其他的样式），如下：

<style type="text/css">

{

    margin:0px;

    padding:0px;

    }

选择器

1.标签选择器  用标签名做选择器

p

{

    background-color:#0F6;

    color:#F6F;

    text-decoration:underline;}

以上是采用外部样式表的格式写出了的。
2.class 选择器。都是以“.”开头的

.p

{

    text-decoration:underline;

    font-family:"Lucida Console", Monaco, monospace, "楷体";

    color:#F00;

    font-size:30px;}

<body>

<div class="p">格林童话</div>

</body>

</html>

3.ID选择器 以#开头

#pp

{

    font-style:normal;

    text-decoration:underline;

    color:#03C;

    background-size:cover;

    }

<body>

<div id="pp">安徒生童话</div>

</body>

</html>

4.复合选择器

1）用“，”隔开，表示并列

<style type="text/css">

p,span

{

	text-decoration:overline;

	color:#0ff;

	width:100px;

	height:60px;

	}

</style>

2）用空格隔开 表示后代

.main p

{

    background-color:#00F;

    font-size:50px;

    color:#3F9;}

</style>

3）筛选“.”

p.sp

{

	font-style:normal;

	text-decoration:underline;

	color:#03C;

	background-size:cover}

链接的style：

a:link 超链接被点前状态

a:visited 超链接点击后状态

a:hover 悬停在超链接时

a:active 点击超链接时

在定义这些状态时，有一个顺序l v h a

a:link

{

    text-decoration:none;

    color:#000;}

a:visited

{

    text-decoration:none;

    color:#000;}

a:hover

{

    color:#F00;

    text-decoration:underline;}

a:active

{

    text-decoration:underline;

    color:#C60;}

3月22 关于CSS的更多相关文章

  1. 2015年10月22日CSS学习笔记

    XHTML1.0对HTML4.0的改进 借鉴了XML的写法,语法更加严格. 把页面的内容和样式分离了,废弃了html4中的表示样式的标签和属性.推荐使用css来描述页面的样式. CSS样式的优先级 ! ...

  2. 12月22日《奥威Power-BI财务报表数据填报》腾讯课堂开课啦

    一扇可以通向任何地方的“任意门”,是我们多少人幼时最梦寐以求的道具之一.即使到了现在,工作中的我们还会时不时有“世界那么大,我想去看看”的念头,或者在突然不想工作的时刻,幻想着自己的家门变成了“任意门 ...

  3. Autodesk 最新开发技术研讨会 -8月22日-Autodesk北京办公室

    为了增进与广大中国地区Autodesk产品的二次开发人员的了解与互动,帮助中国地区的Autodesk产品二次开发人员了解Autodesk最新的二次开发技术动向,并获得Autodesk公司专业开发支持顾 ...

  4. 见见面、聊聊天 - 5月22日晚7点Meetup，三里屯绿树旁酒吧，畅谈云技术和应用

    总是邮件.QQ什么的线上聊,让我们见面吧,不怕见光死,呵呵.   我和同事会先抛砖引玉,给大家介绍一下Autodesk几款最新的云技术和解决方案,然后大家就可畅所欲言,自由交流.来自五湖四海的人,为了 ...

  5. 2016年12月22日 星期四 --出埃及记 Exodus 21:17

    2016年12月22日 星期四 --出埃及记 Exodus 21:17 "Anyone who curses his father or mother must be put to deat ...

  6. 转：[置顶] 从头到尾彻底理解KMP（2014年8月22日版）

    [置顶] 从头到尾彻底理解KMP(2014年8月22日版)

  7. 2016年11月22日 星期二 --出埃及记 Exodus 20:13

    2016年11月22日 星期二 --出埃及记 Exodus 20:13 "You shall not murder.不可杀人.

  8. 2016年10月22日 星期六 --出埃及记 Exodus 19:6

    2016年10月22日 星期六 --出埃及记 Exodus 19:6 you will be for me a kingdom of priests and a holy nation.' These ...

  9. 微软SQL Server认证最新信息（17年5月22日更新），感兴趣的进来看看哟

    之前一直有在关注微软认证的一些消息,由于最新的SQL Server认证加入了2016的相关内容,导致课程资料需要大部分更新,但是微软更新相对比较慢,并且经常改版,目前发现的最新的MCP Cert Pa ...

随机推荐

  1. Trim Galore用法及参数考量

    Trim Galore是一个非常流行的用于「去接头序列」的软件,用于处理高通量测序得到的原始数据.通常我们从测序公司拿到数据后,第一步就是评估数据的质量以及对raw data去接头处理.公司拿来的数据 ...

  2. 《计算机网络》-CCNA命令大全

    Router> //用户模式,只能简单的show及ping/tracer Router>enable //从用户模式进入特权模式 Router# //特权模式,能够进行所有的show及pi ...

  3. 【SQL】【Join基础】了解sql中的join用法，看这一篇就够了

    转自: https://www.cnblogs.com/reaptomorrow-flydream/p/8145610.html SQL JOIN 子句用于把来自两个或多个表的行结合起来,基于这些表之 ...

  4. facebook api之Access Tokens之Business Manager System User

    Business Manager System User Make programatic, automated actions on ad objects or Pages, or do progr ...

  5. Quartus工程中各文件类型的含义

    https://blog.csdn.net/jingliangliu/article/details/52245497 .jic           JTAG Indirect Configurati ...

  6. markdown一些网站

    1.https://stackedit.io/editor 2.https://github.com/bioinformatist/LncPipeReporter 3.

  7. idea中svn的使用教程

    引言:以下是idea集成小乌龟后的svn使用教程,一张图足以说明问题,后续如果遇到了比较复杂一点的问题再来补充. 参考文档:https://blog.csdn.net/liuhailiuhai12/a ...

  8. EsayUI + MVC + ADO.NET(项目架构)

    项目目录   1.项目架构: http://www.cnblogs.com/liuxiaoji/p/3922506.html  2.仓储基础接口: http://www.cnblogs.com/liu ...

  9. Oracle简单语句查询

    语法3-1:简单查询语句语法 SELECT [DISTINCT] * |列名称[AS][列别名],列名称[AS][列别名],...FROM 表名称[表别名]; 在整个简单查询之中,主要有两个子句完成: ...

  10. 解决微信video全屏的问题，不在本页面播放

    在微信浏览器中使用video标签,点击播放会跳出本页面,自动进行全屏播放,原因是自动跳转到手机微信内置的浏览器中去播放去了!!! 在video中加上连个属性就好了,反正最近的一个项目,我是这样做的就好 ...