前端
广义 用户能看见能交互的界面,
狭义 客户端浏览器界面
html5
html+css+js
应用 客户端,浏览器网页
html语言
HTML: 超文本标记语言
```python
# 学习html的目的: 完成页面结构的搭建 (什么时候用什么标签)
# html属于标记语言: 标记语言为非编程语言,不具备编程语言具备的程序逻辑
<html>
<head>
<!-- 字符编码 -->
<meta charset="utf-8">
<!-- 页面标签的标题 -->
<title>页面</title>
<!-- 内部或外部的css样式 | js脚本 | 页面其他设置 -->
</head>
<body>
<!-- 所有页面显示的内容: 文本 | 图片 | 视频 | 超链接 | 表格 | 表单 ... -->
<!-- js脚本 -->
</body>
</html>
标签 <>
指令 <! 开头 <! doctype html>
专业字符 <>> <<>< >
标签:
<div>三无 无语义 无功能 无样式
<a> 返回锚点最好应用<a href='#top'>顶点返回 如果在某处<a name='top' id='top'>返回定点
<.p> 段落
ul<li>列表
<a href='链接' target=‘_blank 或者 _self’> 超链接 blank另外打开 self 自己跳转
<img src='链接‘ alt='加载失败后提示' width=200px height=200px 宽和高最好不要一起定义>图片
7.常用的文本类标签: span i b
h1 h2 h3
<!--<span>文本</span>-->
<!--<i>斜体</i>-->
<!--<em>斜体强调</em>-->
<!--<b>加粗</b>-->
<!--<strong>加粗强调</strong>-->
<!--<sup>上角表</sup>-->
<!--<sub>下角标</sub>-->
css完成页面布局
将原来出现在标签内部的样式分离开来, 可以用一个个选择器加以管理, 达到页面与样式的解耦合目的, 从而提高代码的复用性与开发效率
选择器用来将css与html建立关联的桥梁, 称之为css选择器 作用域 样式块满足css连接语法的众多样式
选择器有内联 行间式 外联
行间式
在<>中进行 属性与属性值用等号 属性之间;
写在style标签中(style标签一般出现在head标签中)
ii)用选择器与html建立连接
iii)样式块书写在作用域内
'''
# 3.外联式
'''
i)css样式完全与html文件脱离, 形成单独的.css文件, 样式书写在.css文件中
ii)用选择器与html建立连接
iii)样式块书写在作用域内
iv)要将.css文件与.html文件建立关联 => <link rel="stylesheet" href="css文件的相对路径">
'''
开发: 最常用的是外联式, 内联与行间辅助样式布局
测试: 内联式, 可读性最强, 且解耦有复用性
行间的应用场景: 最简单粗暴, js操作的样式都是行间式