HTML基础（一）

来源：互联网发布：java开发英文简历编辑：程序博客网时间：2024/06/08 09:19

本文是刚刚接触HTML的菜鸟写的一些入门的知识点笔记。使用的教程是W3School HTML教程，主要是对个人回顾相关知识有所帮助，会不断进行更改。
本文描述的HTML知识包括从教程开始到HTML CSS

HTML: HyperText Markup Language是一种标记语言而不是编程语言
网页由HTML文档描述

HTML tag = Markup tag 标记标签：尖括号，总是成对出现（分别是开始标签和结束标签）
严格来说开始标签可以不和结束标签成对出现，只出现一个开始标签也能被浏览器正式解析，但是作为一种好的编程习惯，应该让开始标签和结束标签成对出现。而且貌似如果不成对出现也会出问题，但目前没观察到。标签最好使用小写，当然用大写也是可以的，为了统一以及输入方便今后则均使用小写。

以下结束标签被省略

<html>整个网页的标签<body>网页可见主体标签？（可是好像就只是叫这个名字而已）<h1> <h2> ... <h6>标题，<h7>开始好像就认为有没有也没差了<p>段落<a href="">链接<img src="" width="" height"" />图像:width 和 height是实际显示图像的宽和高，即缩放而非截取<br />换行，用<br>其实也可以但是为了保障安全最好使用<br />进行换行

HTML元素指的是从start tag到end tag中间的所有代码。主要有三部分内容（start tag, content, end tag），其中start tag可以含有属性attributes。
attributes是名称与值对的组合，值一般带有包括在引号内，一般来说，单引号双引号都行，但属性值本身含有双引号的话，则必须使用单引号将值包括：
几个属性实例：style（行内样式），class（类名），id（元素唯一的id），title（额外信息）（以上四个属性大多数HTML元素都有），table（定义HTML表格）
content则可以有可以没有，注意content中的内容多个空行和空格没有使用格式化标签的情况下都会被缩略成一个空格。

HTML标题，浏览器会自动地在标题前后添加空行（因为标题是块级元素，凡块级元素前后添加一个额外的空行）
HTML水平线，<hr />，一条水平线，为啥要用怎么高大上的名字
HTML注释，
HTML段落，是块级元素，不要使用插入空行，最好用
代替。
HTML style属性（HTML 4引入），因为引入该属性和CSS从而被废弃的标签包括<center> <basefont> <s> <strike> ，属性则包括align bgcolor color。
1.background-color 淘汰了 bgcolor属性
2.font-family、color、font-size 淘汰了 font标签
3.text-align 淘汰了 align属性

HTML格式化
文本格式化标签

<b> 粗体文本 <big> 大号字 <em> 着重文字<i> 斜体文字 <small> 小号字 <strong> 加重语气（什么鬼描述啦）<sub> 下标字 <sup> 上标字 <ins> 插入字<del> 删除字(<s> <strike> 代替）

计算机输出标签

<code> 计算机代码（不保留多余的空格和折行，所以一般在code中内置pre）<kbd> 键盘码，键盘输入 <samp> 代码样本，计算机输出<tt> 打字机代码 <var> 变量 <pre> 预格式文本（代替了<listing> <plaintext> <xmp>）

引用和术语定义

<abbr> 缩写（可为浏览器搜索提供信息） <acronym> 首字母缩写 <address> 地址（大多数浏览器会在后面添加折行） <bdo> 文字方向(双流向覆盖，bi-directinal override) <blockquote> 长引用（浏览器添加换行，外边距）<q> 短引用，只有个双引号 <cite> 引用，引证，著作标题 <dfn> 项目

基于内容的样式（content-based style）赋予标签含义，而不是仅仅格式化，应该尽量使用这种样式

<abbr> <acronym> <cite> <code><dfn> 三种定义项目的方式1.<dfn title=""> ... </dfn>2.<dfn> <abbr title="">3.<dfn>...</dfn>

物理样式（physical style）在可以选择的情况下尽量避免使用这种样式

<em> <kbd> <swap> <strong> <strike> <tt><var> <b> <big> <i> <s> <small> <sub> <sup>

注释：如上

<!-- ... -->

条件注释

<!-- [if IE 8]>    ...<![endif]-->

HTML CSS
外部样式表（多个文件）

<head><link rel="stylesheet" type="text/css" href="mystyle.css"></head>

内部样式表（单个文件）

<head><style type="text/css">body{background-color:red}p{margin-left:20px}</style></head>

内联样式（个别元素）

<p style="color:red; margin-left:20px"></p>

说明：<style> 定义样式<link> 资源引用<div> 定义文档中的节或区域<spam> 行内的小块或区域

其后则是应该跳至CSS的教程部分。

0 0