起名开卷:数学之美

近日一段时间读之蝇头照技术的书,翻阅了,一仍是《数学的美》,一本书《微信公众平台企业应用开发实战》,以下是享受的读书笔记:

标签:HTML+CSS

率先准是吴军博士的修,全书介绍了部分数学原理和数学模型在Google技术被的用,其中也会提到有算法或模型的发明者的勇于事迹,这有明了更能唤起自己的志趣。比如,书中涉嫌Google的Amit
Singhal(阿米特*辛格博士)是Google的“AK-47”的设计者。总所周知,AK-47冲锋枪的宏图简单实用、不易损坏、可靠性好又操作简易,算法为是如此,简单实用最实用,这就是开被提到的“简单哲学”的缓解问题之法门。任何领域还可以与哲学挂及挑起,哲学同美学是有着科目的高祖为非呢过,万学归宗吧。

哎是选择器?

诸一样长条css样式声明(定义)由个别有些组成,形式如下:

选择器{
    样式;
}

在{}之前的有些即使是“选择器”,“选择器”指明了{}中的“样式”的作用对象,也即是“样式”作用被网页中的什么样因素

《数学之美》 / 吴军 著

签选择器

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

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

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

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>认识html标签</title>
<style type="text/css">
h1{
    font-weight:normal;
    color:red;
    }
</style>
</head>
<body>
    <h1>勇气</h1>
    <p>三年级时,我还是一个胆小如鼠的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
    <p>到了三年级下学期时,我们班上了一节公开课,老师提出了一个很简单的问题,班里很多同学都举手了,甚至成绩比我差很多的,也举手了,还说着:"我来,我来。"我环顾了四周,就我没有举手。</p>
    <img src="http://a.hiphotos.baidu.com/zhidao/wh%3D600%2C800/sign=e655190ad2160924dc70aa1de43719c2/bd315c6034a85edfdd19807f4b540923dc5475d0.jpg" >
</body>
</html>

虽吴军博士试图以内容深入浅出,但要么出成百上千情节无法消化,所以基本上算是翻阅。不过实在为了解了数学之妙处,对自之职业生涯有很特别带作用,毕竟知道顶级的处理器科学家尚且以研把什么。

类选择器

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

语法:

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

注意:

1、英文圆点开头

2、其中类选器名称可以肆意起名(但并非打中文)

使用方式:

先是步:使用合适的签把要修饰的情节标记起来,如下:

胆小如鼠

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

胆小如鼠

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

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

如下代码

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

内部,吴军博士浅显、平易的言语为工程领域的晚辈讲述了重重历。比如开中提到的“做事的计有道和技巧”两种程度,道之地步就是是寻找有题目的念和实质,从精神上化解;而技就是发现一个缓解一个,不能够从根本上解决问题。有的上还会见起哲学的角度来描述解决问题的点子,比如“简单的哲学”,在缓解问题之进程被,“简单而实用”是不过有效之法。总之还有不少浩大。

ID选择器

在博上面,ID选择器都类似于类选择切合,但也有一部分生死攸关之别:

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

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

脚代码中不怕是一个ID选择符合的整体实例。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>认识html标签</title>
<style type="text/css">
#stress{
    color:red;
}
#setGreen{
    color:green;
}

</style>
</head>
<body>
    <h1>勇气</h1>
    <p>三年级时,我还是一个胆小如鼠的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
    <p>到了三年级下学期时,我们班上了一节公开课,老师提出了一个很简单的问题,班里很多同学都举手了,甚至成绩比我差很多的,也举手了,还说着:"我来,我来。"我环顾了四周,就我没有举手。</p>

</body>
</html>

吴军博士在题被的语言的好玩、幽默也是抓住自己的地方有。比如,在涉日本海军大将山本五十六时时,他在括号里备注“他父亲56年度时非常之他,所以起名五十六”。让人以朗诵专业书之经过遭到吗能够开心一刻,大师才有境界。

好像及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底作用。

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

</body>
</html>

比方打数学与技艺之角度上说,书被的内容真的难打标准的角度评论,对自家而言有点深奥,只了解该奥义也未敢说了解了。希望随着自己之论争功底与技能更更成熟的时节,那时,我之正统功力呢会见趁机增长。这也是笔者以继记着想读者就的某些,他这么写道:采用不当的模型在一定的场地,或许勉强有效,就比如我们介绍的地心说一样,毕竟为使用了几千年。但是错误的模子终究是远离真理的,其负面影响会慢慢显现出来。其结果不仅在于远离了对的结果,而且常将本简单的事务闹得不得了复杂,以至于最终使崩溃。在次还是电脑的世界里,作者试图使于我们,科学的型和艺术才是正确的缓解问题之“道”,而无是单纯停留于“术”的层系上。掌握核心的专业技能要当理论功底之上,才会造有正规的功力,多控制理论必要性很挺。

子选择器

再有一个比有效的选项器子选择器,即超过标志(>),用于选择指定标签元素的第一代子元素。如右代码编辑器中的代码:

.food>li{border:1px solid red;}

旋即行代码会使class名为food下的子元素li(水果、蔬菜)加入红色实线边框。
如下:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>子选择符</title>
<style type="text/css">
.food>li{border:1px solid red;}/*添加边框样式(粗细为1px, 颜色为红色的实线)*/
.first>span{border:1px solid red;}
</style>
</head>
<body>
<p class="first">三年级时,我还是一个胆小如鼠的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
<h1>食物</h1>
<ul class="food">
    <li>水果
        <ul class="food">
            <li>香蕉</li>
            <li>苹果</li>
            <li>梨</li>
        </ul>
    </li>
    <li>蔬菜
        <ul>
            <li>白菜</li>
            <li>油菜</li>
            <li>卷心菜</li>
        </ul>
    </li>
</ul>
</body>
</html>

仲比照之撰稿人是刘婕,这按照开打来是为了进行自己之技术视野,读毕以后认为值不甚。开发企业微信公众平台利用,了解核心的微信API和一些为主的次第设计之想就是可就书被介绍的技术层次。不引进阅读,如果想学微信企业应用开发的同桌,可以一直去微信的官网了解API,结合自己的品种,封装一法副项目工作需求的框架。个人认为,这仍开整本都止是包装微信的API而已。

包含(后代)选择器

富含选择器,即进入空格,用于选择指定标签元素下的后辈元素。如xia:

.first  span{color:red;}

随即行代码会要第一截文字内容中之“胆小若鼠”字体颜色变为红色。

要留心是选择器与子选择器的分,子选择器(child
selector)仅是指她的直后代,或者你可以清楚吧图于子元素的率先代子孙。而后人选择器是作用为所有子后代元素。后代选择器通过空格来进行精选,而子选择器是经过“>”进行抉择。

总结:>企图于元素的第一代后代,空格打算于元素的有后代。
如下:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>后代选择器</title>
<style type="text/css">
.first span{color:red;}

.food li{
    border:1px solid red;/*添加边框样式(粗细为1px, 颜色为红色的实线)*/   
}
</style>
</head>
<body>
 <p class="first">三年级时,我还是一个胆小如鼠的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
<!--下面是本小节任务代码-->
<ul class="food">
    <li>水果
        <ul>
            <li>香蕉</li>
            <li>苹果</li>
            <li>梨</li>
        </ul>
    </li>
    <li>蔬菜
        <ul>
            <li>白菜</li>
            <li>油菜</li>
            <li>卷心菜</li>
        </ul>
    </li>
</ul>

</body>
</html>

《微信公众平台企业应用开发实践》 / 刘婕 著

通用选择器

通用选择器是功能最好有力的选择器,它使用一个(*)声泪俱下指定,它的来意是匹配html中所有标签元素,如下使用下代码应用html中自由标签元素字体颜色全部设置也红:

* {color:red;}

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>* 选择符</title>
<style type="text/css">
* {color:red; font-size:20px;}


</style>
</head>
<body>
    <h1>勇气</h1>
    <p>三年级时,我还是一个胆小如鼠的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
    <p>到了三年级下学期时,我们班上了一节公开课,老师提出了一个很简单的问题,班里很多同学都举手了,甚至成绩比我差很多的,也举手了,还说着:"我来,我来。"我环顾了四周,就我没有举手。</p>
</body>
</html>

最终,借用吴军博士当《浪潮的峰》中的一致词话了:在人类命运降临的壮烈瞬间,市民的全套美德—小心、顺从、勤勉、谨慎,都不算,它一直就要求上才人,并且用他培植成不朽的影像。命运鄙视地将畏首畏尾的丁拒之门外。命运—这世上的别样一样个睿智,只愿就此猛的膀子把勇敢者高高举起,送上大胆们的西方。

伪类选择符合

复幽默之凡伪类选择符合,为什么叫伪类选择适合,它同意让html不存的签(标签的某种状态)设置样式,比如说我们吃html中一个签元素的鼠标滑动了之状态来安装字体颜色:

a:hover{color:red;}

上面一行代码就是吧 a
标签鼠标滑过的状态设置字体颜色变红。这样就算见面要第一段子文字内容被的“胆小而鼠”文字在鼠标滑动了书颜色变为红色特效。

至于伪选择符:
关于伪类选择适合,到目前为止,可以配合所有浏鉴器的“伪类选择切合”就是 a
标签及采用 :hover
了(其实伪类选择切合还有很多,尤其是css3吃,但是以无克配合所有浏览器,所以只是是语了这等同种植最常用的)。其实:hover
可以在任意的签上,比如说
p:hover,但是其的兼容性也是可怜不好的,所以现在比较常用的要a:hover的组合。

 <p class="first">三年级时,我还是一个<a href="http://www.baidu.com">胆小如鼠</a>的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>

分组选择切合

当你想为html中多个标签元素设置和一个体裁时,可以使分组选择符合(,),如下代码为右代码编辑器中之h1span标签而安装字体颜色吗革命:

h1,span{color:red;}

她一定给下两履代码:

h1{color:red;}
span{color:red;}

发表评论

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

网站地图xml地图