网页是由什么东西构成的?
一个网站由如下三个部分构成
1.文本内容,常见的为文字、数字、符号等。
2.其他文件的引用,这些文件包括图片、视频、音乐、CSS样式表、JS脚本、php文件等,它们一般由html的标签嵌入或者通过标签的属性引入。
3.标记,标记是为了对文本以及引用文件进行描述。
html设计思想
网站的内容是通过html标签的方式将内容包含在内并在浏览中渲染出来。html中文译名为超文本标记语言,超文本不是超越的意思,而是指包含超链接的文本。标记,将需要在浏览器渲染的内容以标签的方式标记出来。语言,html翻译为语言,但它不是编程语言,只是一种书写html文档的工具,或者说是一种书写格式。
html的基本页面
一个基本的html结构是由以下几组标签实现的:
1.声明<!DOCTYPE html>,它是一个单标签,没有结束符号/,不严格区分大小写,用来告知浏览器这个html文档采用了哪个html版本书写的,上述为html5.0版本。
2.根标签<html></html>,一个双标签,当前页面的html文档必须在这对根标签中书写。在<html>开始标签中,通常都会默认一个属性lang=”en”或”zh-CN”等,在=号操作符右边的字符串是这个属性的值,用以告知搜索引擎这个html文档采用何种语言进行编写,比如英语、中文。
3.<head><meta charser="utf-8"><meta name="viewport" content="width="device-width, initial-scale=1.0 /></head>,这个标签中内容是用来告诉浏览器或者搜索引擎这个html文档采用了utf-8字符编码集,这个页面宽度或者高度按照设备的屏幕大小来配置的,是否允许页面缩放,或者按照原样1:1的比例输出。
4.浏览器标签<title></title>标签中的内容一般在浏览器左上角显示,表明这个页面的标题叫什么。
5.页面主体内容<body></body>这个标签中的内容通常是用户,或者浏览者最关注的,他们打开一个网页最想看到的内容就是通过这个标签中的内容展现出来的,而我们要做的事,就是在这个标签内部添加各种各样的标签,把整个网站的内容以标签的形式通过浏览器向用户展示。
<!DOCTYPE html>
<html>
<head>
<meta charset ="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title></title>
</head>
<body>
<!--主体内容区-->
</body>
</html>
这个页面结构需要注意他们的嵌套关系,一般都过emmet语法可以自动生成,在<head></head>标签中还可以引入css样式表等。
元素,属性与值
元素一般分为两种:非空元素、空元素。
1.非空元素
由一组双标签来表示的标签,比如:<h2>这是一个非空标签</h2>,<h2>表示开始标签,</h2>表示结束标签,它们属于一组标签,中间的文本部分称为元素内容,将他们全部结合起来,这就是一个h2元素。
2.空元素
只有一个标签表示的标签。比如:<img src="https://www.baidu.com" alt="百度">,它只有一个<img>开始标签,没有结束标签,它的内容来自外部 www.baidu.com 这个URL地址,通过src这个属性将内容引入到<img>这个标签内,也有些空标签是双标签,比如<video></video><audio></audio>等。
3.属性,上述的alt=”百度”就是这个<img>标签的属性跟值
alt是属性名 ,”百度”为alt这个属性的值,属性值一般由双引号或者单引号括起来,属性值可以是数值、字符串、布尔值、固定格式、预定义值,需要根据这个属性的具体类型来给定属性值。
课程总结:
老师,我真的不懂该怎么写体会跟总结,这次的作业,更多的还是用文字描述,实在是太麻烦了,但是不描述,也无法向你表明了我到底掌握了多少html的基础知识,想要学习更详细的东西,还是需要课后自己看手册,多练习,这次作业没用到markdown语法的更多功能,下次作业再用,关于作业里没写到的层级嵌套关系、三大通用属性、URL路径引用、文本字符、文件名和文件夹的规范书写、语义化标签,我掌握得还行,就这样了。