Python学习第233课css中的

很多时候,网页上的某些元素,是需要给它设定宽度和高度的,比如一张图片,一般情况下使需要给它给定一个具体的宽度和高度的,这样浏览器在解析你的网页代码时,看到你代码中设定的宽高,就会直接按你的宽高去绘制网页,否则,浏览器就会自己去计算你这个网页中的这个图片的宽高,计算完才会去绘制网页,这样多了一个计算宽高的步骤,就会影响网页的渲染(绘制)速度,作为一个开发者,不是说仅仅把产品开发出来就算大功告成,你的产品一定要追求极致体验,这样用户才会乐意去使用。假如用户访问你的网站时,网页打开速度很慢,他很可能就会失去耐心,很可能关闭你的网站,这样不就造成用户流失了吗?当然这是产品层面的思维和意识,在这里我们不去多讲。我们还是回到css的知识,css是用来修饰网页的,前面说到网页中的元素一般需要我们给定宽高,这个宽度和高度就需要在css里面去写。无论是宽度还是高度,都属于长度,既然是长度,就有长度单位,比如公里、米、分米、厘米、毫米等。css中的长度单位主要有3种:px、em、remcss中最常用的长度单位是px。我们还是在myfirsthtml.html这个文件中的代码的基础上进行举例。如上图所示,我们有一个p元素,这个p元素的内容是你好!。我们之前并没有给它设定宽高,现在我们在css里面给它设定宽高。在css中,宽度是英文width,高度是英文height,所以给这个p元素设定宽高的css这样写:#hello{width:px;/*宽度、高度可以根据自己的需要进行设定*/height:50px;color:green/*这个color是之前写的*/}为了方便查看和调整html元素的样式,我们可以给一个html元素的css中加上边框属性,包括边框的颜色、边框的样式、边框的粗细。代码如下:#hello{width:px;/*宽度、高度可以根据自己的需要进行设定*/height:50px;color:green;/*这个color是之前写的*/border-width:1px;/*边框的宽度,也就是粗细*/border-style:solid;/*边框的风格,实线是solid,虚线是dottedd*/border-color:red;/*边框的颜色,红色*/}我们在vscode中这样写一下,如图:我们保存代码,在浏览器中看看这个网页的效果,如下图:我们看到,红色边框和里面的你好!就是我们给id为hello的p元素写的css代码的效果。这个p元素就按我们设定的宽度为px,高度为50px在浏览器中显示。实际上,边框的属性可以简写成一行,即:#hello{width:pxheight:50px;color:green;border:1pxsolidred}大家可以自己试下,按上面的简写形式,在浏览器中的效果是一样的。以上是关于css中的长度单位px的介绍,关于px、em、rem,如果你要做前端工程师,就必须要清楚这三个长度单位的区别和用法。但是我们是学习Python,是用Python去解决相关问题,所以就对前端的东西有一些基本了解即可。所以我们现在只需要知道,在给html元素设定宽高时,长度单位用px就行了。至于em和rem的用法以及它们和px的区别,就不具体展开了,这涉及到计算机和手机的屏幕分辨率知识、不同浏览器的兼容性知识、px和em、rem之间的换算等等,所以在这里不去深入这几个知识点,这几个知识点主要是前端工程师的工作必须要懂,我们不做前端工作的话,不懂也没什么影响。庄子曰:吾生也有涯,而知也无涯。以有涯随无涯,殆已!人生是有限的,但知识是无限的(没有边界的),用有限的人生追求无限的知识,是必然失败的。连年前的古人都感叹知识无限、人生有限,何况今天的我们呢?我们今天的知识量比古代多几十万倍应该都不止。前端的知识体系也是非常庞大的,所以我们要明确目标,有选择性的学习。我们的目的是学习Python,至于前端,以后想往前端方向发展或者有机会去做前端领域的话,再去深入也不迟。不管你是初中生、高中生、还是没毕业的大学生、或者是非it互联网行业的职场人士,其实都可以从Python入手,学一点编程以及计算机知识。乔布斯就说过,每一个人都应该至少学一年的编程,这样会帮助你建立一种新的思考问题和认识世界的方式。不是说学Python就一定是为了去当程序员,而是说,在如今的互联网+时代,编程已不再是程序员、工程师的专属技能,通过学习它,能给你的未来增加一种可能性和选择性以及个人竞争力,Python作为最贴近人工智能的编程语言,可能是你通往未来世界的工具,也可能会给你的人生带来新的机遇。


转载请注明:http://www.aierlanlan.com/rzdk/7251.html