<!DOCTYPE html>
//h5版本的文档类型,html超文本标记语言,向下兼容
//只要保存就可以热更新网页内容,不需要像后端那样重启服务器。
//这里不介绍快捷键嗷,不同环境不一样。
<html lang="en">
//html开始标签,网页内容要写进这里。
//lang就是language语言,lang=en英文
<head>
//头文件
<meta charset="UTF-8">
//meta 提供有关信息针对搜索引擎内容或关键词
//字符集utf-8:万国码,通用语言字符集啥语言都有(大部分国家包括cn)
<meta http-equiv="X-UA-Compatible" content="IE=edge">
//处理兼容,兼容浏览器等等
<meta name="viewport" content="width=device-width, initial-scale=1.0">
//适配移动设备,像素分辨率/框体分割比例
<title>网页标题</title>
//网页标题,浏览器上面会显示
</head>
//有<>就必有</>但是html语法不严格,有时候没有</>也行。
<body>
//html里包含了head,body等子标签,就是一个人的头和身体,类似后端语言,头文件和函数
</body>
</html>
下面的内容基本只写body里面的内容。
html简单直接朴素
css样式,代码繁琐但是写出来好看
js脚本语言,网页能动主要靠它
能用html优先用html,再用剩下两样加以修饰
html由标签组成
文档用的标签
标题标签,即文章标题<>里面写h123456越来越小,文档里的一级二级标题等等,这是office内容。实际上这个只是控制了文字的大小粗细,虽然确实可以用h标签来搜索文档内容,但是我们不在乎。
网页设计中为了样式设计,并不按照office限制几级标题的使用,只能说尽可能只用一个h1。
段落标签p:html输出字符作文档的时候是连续输出的不分段落,分段落就得加p标签。
br/标签换行
加粗b标签:如果用h标签加粗文字会换行,b就是单纯加粗,strong强大/强壮/也是加粗外加强调
倾斜i标签:斜体字不强调,em标签斜体强调。现在写网页没必要考虑强调了,强调太多了搜索引擎会屏蔽。
span style=“”区分样式标签,给某句话加样式。style=“background-color背景颜色font-size
字号”等等。
sub数学化学用的下标,sup上标,幂函数之类。<>+</>要写的
ul,li两个标签可以互相嵌套,用于无需列表
ol有序列表,列表我不咋用,到时候查wiki罢。
图像等多媒体标签
终于到img:
src图像url src=‘绝对/相对目录’
width图片宽 =‘像素’图像按比例缩放
height图片高
alt指定替换文字(图像未加载等)
title标记
a标签:超链接,《a href=‘链接’ target=‘选择窗口’》《/a》(英文尖括号,我的笔记软件自动识别代码,所以我用中文符号混淆一下)
(下划线)blank新窗口打开 (下划线)self当前页面打开(记得加下划线,我下划线符号被笔记软件占用了)
原页面跳转:《a href=”#+标签id“》链接名《/a》
需要在要跳转的标签里加id=对应的id名
div画框框标签,简单又复杂,只要《div》框体名《/div》,框框就画好了
重点是给div加样式,在style里写样式,通过id引入div。id=‘div1’,#div1{heyght:像素;width:像素;background-color:颜色;}等等样式,这就要看设计能力了。