记录自己学习前端的过程,初次使用markdown
今天学习html基础
一、建站流程
- 建站流程指的是一个网站从开始编码阶段到最后上线阶段的过程
- 流程：
a、购买域名（网址 http://www.jd.com） 作用：可以通过它访问网站 相当于生活中的地址
b、购买服务器（租用服务器）作用：存储网站和程序
服务器价格是非常高的，为了方便开发使用，有人会购买很多的服务器用于出租服务器分为两种：真实的服务器、虚拟服务器（虚拟云主机），如果购买或者租用服务器价格贵，需要自己维护不方便，有人提出了可以把服务器进行空间的划分，根据空间大小的不同设置账户和密码，这样的话不需要维护价格也非常便宜域名和服务器去哪些网站购买：华为云、百度云、腾讯云、新浪云、万网（阿里云）、新网、西部数码等等
c、网站建设：确定网站主题（客户）、搜集资料（产品经理）、规划网站（UI小姐姐）、制作页面（前端）
d、网站营销（推广）：抖音、快手（直播带货）、今日头条、微信公众号、微博热搜、百度竞价 e、网站维护
二、HTML语言
- html语言是前端开发中的一种语言，HTML在前端里面被称之为结构语言。
- HTML被称作超文本标记语言：
文本：指的是文字，中文、英文、其他语言。在HTML语言里面文本指的是英文
标记：记号，标识。
超文本：指的是网页中除了文字以外的其他的东西，超链接、图片、音频、视频、程序等等，都叫做超文本。
三、HTML语言发展
- 从大的方面来划分，HTML就是HTML语言的第一个版本，XHTML指的是HTML语言的下一个版本，HTML5指的是XHTML是下一个版本，也是HTML语言的最新版本。
- XHTML和HTML区别：XHTML可扩展超文本标记语言，从语法上比HTML语言更为严格，语言区分大小写，必须写闭合标记等等。
- 发展过程：
四、HTML5基本结构
- HTML5基本结构是HTML语言最新的结构，结构其实就是一种规范或者是一个架子，只要按照规范写代码就行。
- HTML5基本结构是HTML语言执行的一个环境。
五、HTML5语言注释
- 注释就是写给自己看的东西，便于理解代码，也可以给别人。、
- 注释语法:
<!--注释语法-->
注意！ 注释的杠不能少于4个</p>
- 乱码：当HTML5基本结构没有设置meta标记的时候低版本的浏览器会出现乱码问题，高版本的浏览器没有设置meta标记时，浏览器会默认给咱们添加，meta标记一定要写
六、HTML5基本结构
<!--声明文档类型，告诉浏览器这是一个什么类型的文档，网页类型-->
<!doctype html>`
<!--根标记，就是标记里面最大的标记。注意点：其他的所有标记都必须放在html标记里面-->
<html>
<!--网页头部-->
<head>
<!--
字符编码：解决乱码、兼容沟通
utf-8 是国际标准编码格式，一般开发中都是使用的这个；
gb2312 这个是咱们自己国家的编码格式（国标）；
GBK 指的是亚太地区的编码格式 包含中国的繁体字，国家的台湾地区使用的就是繁体字
-->
<meta charset="utf-8"/>
<!--网页标题-->
<title>欢迎来到嘿嘿网</title>
</head>
<!--主体：网页内容都是放在它里面的-->
<body>
<!--一级标题，最大的标题-->
<h1>新做网页</h1>
</body>
</html>
七、HTML语法
HTML语法为两种：
常规标记（双标记，对儿标记）：<标记 属性 = “属性值”></标记>
单标记（空标记）：<标记 属性 = “属性值” />
说明：
- 把一对尖括号（<>）里面的单词叫做元素、标记、标签；
- 把标记空格后面的那个单词叫做属性，属性和属性值之前是使用等号连接，属性值是放在双引号里面；
- 一个标记可以用属性也可以没有属性，还可以有多个属性；
- 一个标记如果有多个属性的时候，属性和属性之间不分先后顺序；
- 单标记必须使用斜杠结束。
八、常用HTML标记
1. h1 — h6 标题 （类似word里的标题）
+标题是双标记
+独占一行，自上而下排列
+注意，<h1></h1>在一个网页中只能有一个
+属性：
align = "left | center | right" 文字水平对齐方式
2. p 段落标记
+段落是双标记
+独占一行，自上而下排列
+属性：
align = "left | center | riht " 文字水平对齐方式
3. br 换行标记
+换行是单标记
+独占一行，自上而下排列的
4. hr 水平线标记
+水平线单标记
+独占一行，自上而下排列
+属性：
color = “颜色值” （十六进制或者英文名） 水平线颜色
5. b、strong 加粗标记
+加粗是双标记
+横向排列
6. i、em 斜杠标记
+倾斜是双标记
+横向排列
7. 预留字符：带有特殊意义的符号
+ 表示空格
+ © 表示版权符号
+ × 表示乘号
8. a超链接标记
+ 超链接是双标记
+ 横向排列
+ 属性：
href = “路径”
target = "_blank | _self" _blank 表示新窗口打开 _self 表示当前窗口打开（默认值）
9. 列表标记
+ 无序列表
<ul>
<li></li>
<li></li>
<li></li>
.........
</ul>
+ 有序列表
<ol>
<li></li>
<li></li>
<li></li>
.........
</ol>
属性：
type = "1 | A | a " 列表符号类型
+ 自定义列表
<dl>
<dt></dt> 放的图片或者名词 例如：国家、电影、音乐
<dd></dd> 放的是对上面的解释
..........
</dl>
+ 都是双标记
+ 独占一行，自上而下排列
+ 在网页中如果遇到标记嵌套标记的情况，把外层标记称之为父标记（元素），把里面的标记叫做子标记（元素）
10. img 图片标记
+ 图片标记是单标记
+ 横向排列
+ 属性：
src 路径 （地址）
width 宽度
height 高度
alt 提示信息。例如：当图片由于某种特殊原因（路径错误、网速慢‘、被和谐）无法在网页中显示，此时将图片转换成文字给用户提示
title 表示图片标题。当鼠标悬停（把鼠标放在图片上）在图上显示提示信息
11. table 表格标记
+ 表格标记是双标记
+ 作用：显示数据
+ 组成：table、tr(行)、td(列 or 单元格)、th(表头，所谓表格的标题)
+ 属性：
border 边框
width 宽度
height 高度
align = "left | center |right"水平对齐方式
当align属性设置在table上时表示整个表格对齐；
当align属性设置在tr上时表示整个行内容水平对齐；
当align属性设置在td上时表示单元格内容水平对齐。
valign = "top | middle | bottom"表示表格内容垂直对齐方式(只能设置在tr 或者td 上)
cellspacing 表示单元格与单元格之间的间隙
cellpadding 表示单元格内容到边框之间的距离
bordercolor 表示边框颜色
bgcolor 表示表格背景颜色
colspan 表示合并列
rowspan 表示合并行
九、图片路径
- 绝对路径:：带盘符的路径，网络地址 例如：E:\学习记录\day1\day01\笔记
- 相对路径：一个文件家里面有其他的文件夹，文件夹和文件之间的关系
当当前文件与目标文件在同一目录下时，可以直接写目标文件名+扩展名；
当当前文件与目标文件的文件夹在同一目录下时，先写目标文件夹名/目标文件名+扩展名；
当当前文件的文件夹与目标文件的文件夹在同一目录下时，…/目标文件夹名/目标文件名+扩展名。
今日的博客就逛到这里
5737
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
