成为网页设计师的第一步:html与css

2021.01.23 -

   

在这个科技发达的时代,网路上充满着形形色色的网站,不管是用任何的网站开发工具,他们的基本页面都是用html与css所组成的,那么html与css又是什么呢?

HTML+CSS

HTML与CSS

html是有着各种不同含义标签的网页格式,而一个网页就是由各种不同的标签所组成的。而css则是为了解救html所诞生的。

为什么说是解救呢,在最开始html只是单纯的定义网页的架构与内容,随着人们对网页的美观越来越要求的同时,大家也开始在html里面加了排版的元素,导致html越来越复杂。在一个html里要管理网页的架构、又要管理网页的排版,而css的出现,便可以帮html分担一半的工作,html只要管理网页的架构就好,排版就都交给css。

简单来说呢,html就是一张素颜的脸,而css就是化妆品,能把原本不怎么起眼的html页面打扮得美美的。

DIV

以往我们要做出这个div的样式,会这样打︰
<div style=”width:200px;height:200px;background-color:red;text-align:center;line-height:200px”>DIV</div>
有了css之后html就只需要打
<div>DIV</div>
剩下的样式就由css完成
div{ width:200px; height:200px; background-color:red; text-align:center; line-height:200px }

这样html看起来就不会非常的杂乱,也能够的区分出,架构就是html,样式就是css了。

HTML 5与CSS 3

随着时代的演进,html与css也在不断的改革与变新,而现阶段两者最新的版本分别为HTML 5与CSS 3。

HTML 5

html 5与前几个版本最大的差异在于,简化了很多宣告的写法以及赋予更有实质意义的标签。

以往要宣告网页的编码时,在html 4必须要打:
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>,
而在html 5你只需要打:<meta charset=”utf-8″>

以往在页面排版时你可能会用很多个Div,内容一多,你往往不知道你到底在改什么东西,而html5则赋予了更有意义的标签。例如,以往你可能会用<div id=”header”>才能在css更改这个div的样式,而现在你只需要<header>就可以在css去做更改,也能更清楚的了解网页上的内容是属于html上的哪个部分。

CSS 3

css与html的版本所代表的意思有所不同,html的每一个版本都可以看做一次改革,而css则是不断的新增更有趣的属性。在最新的css 3版本里,则是增加了新的选择器以及动画、文字效果、多列布局和特效等属性。

结论

基本上只要了解了html与css的基本结构与写法,就能自己写出一个好看的网页啰,有关于html以及css架构与更深入的部分,我们在之后的文章会再做更详细的说明。

本站文章禁止转载,违者必究
阅 34
0

在这个科技发达的时代,网路上充满着形形色色的网站,不管是用任何的网站开发工具,他们的基本页面都是用html与c […]

湘公网安备 43011102001693号

    湘ICP备19003021号-1