蓝色海洋的传说 03.04

四、ID选择器

图片 1图片 2

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 5 <title>认识html标签</title>
 6 <style type="text/css">
 7 #stress{
 8     color:red;
 9 }
10 
11 </style>
12 </head>
13 <body>
14     <h1>勇气</h1>
15     <p>三年级时,我还是一个胆小如鼠的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
16     <p>到了三年级下学期时,我们班上了一节公开课,老师提出了一个很简单的问题,班里很多同学都举手了,甚至成绩比我差很多的,也举手了,还说着:"我来,我来。"我环顾了四周,就我没有举手。</p>
17 
18 </body>
19 </html>

ID选择器

于过剩地方,ID选择器都类似于类选择符合,但也出一对着重的别:

1、为标签设置id=”ID名称”,而非是class=”类名称”。

2、ID选择切合的眼前是井号(#)号,而不是英文圆点(.)。

代码编辑器中即是一个ID选择适合的完全实例。

来试试看,为次段子文字被的“公开课”三单字以ID选择器的办法设置也绿色

1.以编辑器的第16行,输入:

公开课

2.在编辑器的第10-12实行,输入:

#setGreen{
   color:green;
}

后记:

亚、标签选择器

图片 3图片 4

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 5 <title>认识html标签</title>
 6 <style type="text/css">
 7 
 8 
 9 
10 
11 </style>
12 </head>
13 <body>
14     <h1>勇气</h1>
15     <p>三年级时,我还是一个胆小如鼠的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
16     <p>到了三年级下学期时,我们班上了一节公开课,老师提出了一个很简单的问题,班里很多同学都举手了,甚至成绩比我差很多的,也举手了,还说着:"我来,我来。"我环顾了四周,就我没有举手。</p>
17     <img src="http://img.mukewang.com/52b4113500018cf102000200.jpg" >
18 </body>
19 </html>

签选择器

签选择器其实就是是html代码中之标签。如代码编辑器中的<html>、<body>、<h1>、<p>、<img>。例如下面代码:

p{font-size:12px;line-height:1.6em;}

上面的css样式代码的意图:为p标签设置12px字号,行间距设置1.6em底体裁。

来试,为标题“勇气”添加样式,把h1标签默认的粗体样式去丢并以书颜色设置为革命

1、在编辑器的第7尽,输入h1{

2、在编辑器的第8行,输入font-weight:normal;

3、在编辑器的第9实行,输入color:red;

4、在编辑器的第10推行,输入}

 

font-weight:normal;/*去丢粗体样式*/

 

若矣岛汉江际。

老三、类选择器

图片 5图片 6

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 5 <title>认识html标签</title>
 6 <style type="text/css">
 7 .stress{
 8     color:red;
 9 }
10 
11 </style>
12 </head>
13 <body>
14     <h1>勇气</h1>
15     <p>三年级时,我还是一个胆小如鼠的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
16     <p>到了三年级下学期时,我们班上了一节公开课,老师提出了一个很简单的问题,班里很多同学都举手了,甚至成绩比我差很多的,也举手了,还说着:"我来,我来。"我环顾了四周,就我没有举手。</p>
17     <img src="http://img.mukewang.com/52b4113500018cf102000200.jpg" >
18 </body>
19 </html>

类选择器

类选择器在css样式编码中是最常用到的,如代码编辑器中的代码:可以实现呢“胆小如鼠”、“勇气”字体设置为红。

语法:

.类选器名称{css样式代码;}

注意:

1、英文圆点开头

2、其中类选器名称可以轻易起名,但切莫能够因为数字开头(但并非打中文噢)

以办法:

首先步:使用相当的标签把要修饰的情标记起来,如下:

胆小如鼠

第二步:使用class=”类选择器名称”为标签设置一个好像,如下:

胆小如鼠

老三步:设置类选器css样式,如下:

.stress{color:red;}/*类前面要加入一个英文圆点*/

 来试试,为次段文字中之“公开课”三独字设置为绿色

1.当编辑器的第16执,输入:

公开课

2.以编辑器的第10-12行,输入:

.setGreen{
   color:green;
}

标签选择器针对的是html自带的签(p,h1),类选择器是好自定义之(利用span
class=””设定一个接近)

催眠—从直视对方的目开始。因为大脑与肉眼是于一道的。

一律、什么是选择器?

图片 7图片 8

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 5 <title>选择器</title>
 6 <style type="text/css">
 7 body{
 8     font-size:12px;
 9     color:red;    
10 }
11 </style>
12 </head>
13 <body>
14 <p>慕课网(IMOOC)是学习编程最简单的免费平台。慕课网提供了丰富的移动端开发、php开发、web前端、html5教程以及css3视频教程等课程资源。它富有交互性及趣味性,并且你可以和朋友一起编程。</p>
15 </body>
16 </html>

嘿是选择器

各级一样久css样式声明(定义)由少数有些构成,形式如下:

选择器{
    样式;
}

每当{}之前的有些就是是“选择器”,“选择器”指明了{}中的“样式”的企图对象,也便是“样式”作用被网页中的哪因素。

仍代码编辑器中第7实行代码中的“body”就是选择器。

车太贤的客串—-那些年看罢之《我的野蛮女友》

五、类以及ID选择器的界别

图片 9图片 10

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 5 <title>类和ID选择器的区别</title>
 6 <style type="text/css">
 7 .stress{
 8     color:red;
 9 }
10 .bigsize{
11     font-size:25px;
12 }
13 #stressid{
14     color:red;
15 }
16 #bigsizeid{
17     font-size:25px;
18 }
19 </style>
20 </head>
21 <body>
22     <h1>勇气</h1>
23     <p>三年级时,我还是一个胆小如鼠的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
24     <p>到了三年级下学期时,我们班上了一节公开课,老师提出了一个很简单的问题,班里很多同学都举手了,甚至成绩比我差很多的,也举手了,还说着:"我来,我来。"我环顾了四周,就我没有举手。</p>
25      <p>到了三年级下学期时,我们班上了一节公开课,老师提出了一个很简单的问题,班里很多同学都举手了,甚至成绩比我差很多的,也举手了,还说着:"我来,我来。"我环顾了四周,就我没有举手。</p>
26     
27 </body>
28 </html>

仿佛和ID选择器的区分

念了类选择器和ID选择器,我们会发觉她们中出成百上千之相似处,是免是两者可以通用为?

咱们绝不急先来总一下他们的相同点和不同点:

相同点:可以使被其它因素
不同点:

1、ID选择器只能在文档中采取同样不好。与类选择器不同,在一个HTML文档中,ID选择器只能采取相同不行,而且就一不善。而接近选择器可以运用频繁。

脚代码是天经地义的:

 <p>三年级时,我还是一个胆小如鼠的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。</p>

设若下面代码是左的:

 <p>三年级时,我还是一个胆小如鼠的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。</p>

2、可以下类似选择器词列表方法也一个素以安装多单样式。我们可以呢一个要素以假设多只样式,但就可用类选择器的点子实现,ID选择器是不可以的(不克使
ID 词列表)。

脚的代码是没错的(完整代码见代码编辑器)

.stress{
    color:red;
}
.bigsize{
    font-size:25px;
}
<p>到了三年级下学期时,我们班上了一节公开课...</p>

面代码的意图是也“三年级”三独字设置文本颜色也红并且字号也25px。

下的代码是未得法的(完整代码见右手代码编辑器)

#stressid{
    color:red;
}
#bigsizeid{
    font-size:25px;
}
<p>到了三年级下学期时,我们班上了一节公开课...</p>

上面代码不可以实现吗“三年级”三只字设置文本颜色吗革命并且字号也25px的图。

 

id就比如身份证号码,是唯一的,该身份证号码就可知代表你。一个总人口未能够闹些许单身份证号码,也非克一个身份证号码表示两独人口。

若是class就如昵称,该昵称为能代表你。一个人数方可出多独昵称,也得以基本上个人用同个昵称。

 

这就是说下用id,什么时用class?

W3C标准这样确定之,在和一个页面内,不容许生同名字的id对象出现,但是允许同一名字的class。

 

如此,一般网站分为头,体,脚有,因为考虑到其当与一个页面就会起同等糟,所以用id,

 

其他的,比如说你定义了一个颜色也red的class,在跟一个页面也许如果再三采用,就用class定义。

 

此外,当页面中因故到js或者如动态调用对象的早晚,要用到id,所以如果基于自己的景使用。

 

class用.

id用#

class可以重名

id不行

 

成熟网站里,你异常少见到css里之所以id选择器的,都是因此class,id选择器留给写js的丁因此,这样避免冲突。

 

id是用来一个特定的样式的(唯一性),并且不得不采用相同不良。class是用来平组一样样式的(相似性),可以以频繁。

 

切莫应当为此用次数来说明,应该说id只能指定唯一元素,而class可以指定多只要素,将这些元素划分为同一接近。

两小无猜的人 相见不 再见

回去朝鲜时~~~

四月—-前世是许俊宰妈妈的仆人,现在外是主人-——珍珠,许俊宰妈妈是公仆。

为此,看偶像剧的观众,不知不觉的观了关于中国二十四节里”小雪“的说字幕—文化输入。

友娜小朋友可听到人鱼真正的动静—–

穿梭情话——不掌握原来的韩文,但是字幕就坏好看了。让丁感动的上演。

而,不是啊人且能够于催眠的。

可望韩国的社保制度—-

准一个流浪者的时尚修养~

台词中为暗含了《野蛮女友》

虽说过着流浪街头的存,但平生没后悔了。

立刻员长者叫千石—–关于美人鱼的传说大多打他嘴里来叙述出来。

韩国文—有协调的意义的说明。

小心警惕门上的标志—已经曝光了之违纪手法。

来地的美人鱼的最好充分的缺陷,便是他的下肢。

要她的腿被了侵蚀,便是去所有的能力,便会丧命。

”别同自己提,太好吃了“

韩国,在东八区—-但是采取的凡东九区的时间!!!

我和你 在这里

若还当自己心里面

I need you ,I love you

如果 有一天

友娜小朋友和美人鱼提出的题目接二连三一个蕴含哲理的问题。

韩国知识在偶尔像剧里的显得—–

高智力骗子的行准备~

车太贤饰演的呢是一个骗子。

说好了,就假设到位哦~

杀人工具是锤子和钉。

首尔~~~许俊宰在那边。

一步步踏在您的脚印漫延

流浪汉的细致之遐思–社会实践。

前世的公家老爷,现在的潜逃犯罪分子马大荣。

供—-转过来  ”运“

揽过的热度慢慢退

许俊宰的还要一个位—警官。

呢您配了只愿

四月,你以后想只要当什么?

自我一旦当,那个家之地主。

同样管辖想使好好看的韩剧!

受人易得愚蠢的特级方法——恐惧!

一个叫汉江之地方,许俊宰以63大厦之风水宝地圈焰火,

思想干预

美人鱼有一个奇异的力,那便是,他们可因接吻来解对方的记。

自家就是好少年?!

妈妈说:

光明的事物通常都是昙花一现,就这么,用肉眼可以看在,然后,好好珍藏在内心。如果产生同等龙,感到悲哀,那即便回忆一下,当时格外烟花好帅,回想一下,那天我们好福。

金姌龄年少时老去的妹子叫“世华“,他吃丁鱼从名叫——也于世华。

自家相信能够移动上前

季集合结束。

人鱼拥有了温馨的名字—–沈清(发音类似于蠢货),但是其好,因为那是许俊宰给他的名字。

end—-

每当是世界上鲜艳夺目芳华。

前世的富太太,现在的许俊宰的妈妈。裕蓝。

特意在意了瞬间营业时间,有中文出现,这儿的神州游客想来不少。

标记—

服饰准备,相对人的日路线悉知~

苟由早至晚直接工作,那什么时候才能够过得福呀?

……

以后,以后—

自我在蓝色大海边

公物老爷妻妾成群,洪兰算是以为得惯的—推断。

I see you ,I miss you

您的社会风气

四月立刻名字真个好放!

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图