首页 > 网页设计 > 网页设计与制作学什么-静态网页入门,制作自己的网页(一)
2023
07-25

网页设计与制作学什么-静态网页入门,制作自己的网页(一)

写在开头

本系列教程主要针对从未接触过网页制作的新哥们。 如果你积累了一定的网页知识,就可以果断关闭了!

Web前端设计涉及到的东西太多了,但是缺乏基础教程吉祥物设计,所以博主希望通过这样的一个系列卡通形象,可以帮助那些想要学习Web编程的人梳理一些基础的、非常重要的知识点。 那么,废话不多说,让我们进入正题吧!

网络编程工具

编写网页的编辑器其实有很多,比如:eclipse、Dreamweaver、VS Code等,即使你用记事本编写网页的代码,然后将后缀名改为.html,也可以在浏览器中运行。

学校教学会更多地使用Dreamweaver网页设计与制作学什么,因为Dreamweaver可以通过界面操作生成一些CSS属性,并且不需要纯代码编写。 不过博主实在不习惯,界面太难受了。 掌握一定的Web编程语法后,VS Code、atom等编辑器可能是更好的选择。

博主使用的是VS Code。 本课没有需要操作的代码内容,所以不讲下载安装。

网页的分类

网页基本上分为两种,一种是静态网页,另一种是动态网页。

什么是静态网页? 什么是动态网页?

静态网页就像是用画笔绘制的一幅画(HTML5、CSS、JS)。 如果要修改,就得把它从显示板(浏览器)上取下来,然后用画笔修改一遍,再贴回显示板上。

另外就是动态网页! 动态网页就像在一幅画上预留一个可变的位置,然后在预留的位置上准备不同情况的绘画,每次根据不同的需要粘贴不同的绘画,而不必一次又一次地绘制来满足观看者。

上面的解释比较直观,也能让初学者明白动态网页是静态网页的完善网页设计与制作学什么,让网页更具互动性和强大性!

Web编程的基本语法

1.网页代码基本结构


<html>
	<head>
		<meta charset="utf-8">
		<title>无标题文档</title>
	</head>
	<body>
	</body>
</html>

上面的结构可以分为三个部分




<html>
	<head>
		
	</head>
	<body>
		
	</body>

</html>

HTML5中的所有标签都可以概括为这样一个公式,显示元素

2. HTML标签的基本语法

A。 标签成对出现

b. 标签不区分大小写

C。 标签可以联合使用或嵌套使用

d. 一个标签可以有多个属性值

3. 标题文本标记

4.文本样式标签

5. 特定文字标记

6.特殊字符

7. 段落标记

8. 水平线标记

9.图像标记

10. 表单标记

11. 列出标记

12. 块容器标记

13. 内联标记

14. 超链接标记

15. 表单标记

16. 输入标记

17. 下拉列表标记

18. 多行文本框标记

19. 音频标记

20.视频标记

总结

这篇博客主要是让朋友们对静态网页最基本的HTML5标签有一个最全面的了解。

结语

如果这篇文章让你学到了一定的知识,不妨点赞关注,让博主看到。 如果讲解中有错误和遗漏的地方,请指出或者在评论中提问,博主会尽快更新和回复,谢谢!

最后编辑:
作者:nuanquewen
吉祥物设计/卡通ip设计/卡通人物设计/卡通形象设计/表情包设计