HTML+CSS+JS串讲 | 青训营笔记

131 阅读2分钟

Web标准的三个组成:

  • HTML(结构)
  • CSS(美化)
  • JavaScript(行动)

HTML是超链接语言,用来显示页面的元素和内容。

CSS控制页面元素的外观(颜色,大小)以及位置等页面样式。

Javascript控制了网页的行为。

HTML是一种超文本标记语言,主要用来实现静态页面,我们在页面看到的文本,图片,视频,声音,表格,链接等都是通过HTML语言描述的,而超文本中的超就是超越‘文本’,可以设置样式,显示图片,播放视频。HTML的是由标签组成,给不同的标签不同的属性,可以实现网页的多彩效果。

image.png

HTML常用标签

标题标签:

h1

h2

...

h6  

段落标签:

p

换行标签:

br

加粗:strong 或 b

斜体:em 或 i

下划线:ins 或 u

删除线:del 或 s

“盒子”:

div(单独占一行,“大盒子”)

span(并列一行,“小盒子”)

图像标签:

img src="图像URL"  图片路径

alt  替换文本,图片显示不出来时用文字代替

title  提示文本,鼠标放在图片上显示的文字

width  图像密度

height  图像高度

border  图像边框粗细

例:

<img src="图像URL"/ alt=""/ title=""/>

<img src="图像URL"/ width="(数字)"/ height="(数字)"/ border="(数字)"/>

特殊字符:

image.png

表格标签:

基本语法:

table

  tr    <! - - 行 - ->  

td 单元格内的文字   <!- - 单元格 - ->  

……

  /tr

……

/table

 

表头单元格标签:

th   

是table head的缩写,直接替换掉 td

列表:

ul表示无序列表

li表示列表项

表单:

image.png

image.png

HTML5新增标签:

视频标签: image.png

音频标签:

image.png

新增input标签:

image.png

image.png

CSS

image.png

CSS3新增功能

CSS3是CSS(层叠样式表)技术的升级版本,是CSS2的升级版本,3只是版本号,它在CSS2.1 的基础上增加了很多强大的新功能。CSS3原理同CSS,是在网页中自定义样式表的选择符,然后在网页中大量引用这些选择符。

image.png

JS

JavaScript(简称“JS”)是当前最流行、应用最广泛的客户端脚本语言,用来在网页中添加一些动态效果与交互功能,在 Web 开发领域有着举足轻重的地位。在html可以用标签引用,也可以用文件引用。

内嵌式js: image.png

外部js文件: image.png