HTML基础学习内容

以下内容为直接贴上代码

不再进行相关知识点的内容书写，以实际例子来展示相应的东西，我觉得这会更有用一些

以下代码均在vscode中进行编写

编码格式为utf-8

首先，使用html5协议，可以获得以下代码串

<!DOCTYPE html>

<head>

<title>Document</title> //这是网页中显示的名字

</head>

<body>

　　//网页的内容

</body>

</html>

html5精简了很多没有必要的东西，使得这个整体更加更单一些

文字和段落方面

大概就是p标签和<h1>等等的标签应用，以下代码写入body中，如下

<body>

<h1>title</h1>

<h2>title2</h2>

<h3>title3</h3>

<h4>title4</h4>

<p style="justify-content: left;">This is a p in style </p>

</body>

以下为个别总结

<b>粗体;
<i>斜体;
<u>下划线;
<sup>上标;
<sub>下标;
<tt>打字机;
<blink>闪烁;
<em>强调(感觉就是斜体);
<strong>加强(感觉和加粗差不多);
<samp>范例;
<code>原始码;
<var>变数(感觉还是斜体);
<dfn>定义(还是斜体);
<cite>引用(依旧是斜体);
<address>地址(斜体).

符号    代码
"       "
&       &
<       <
>       >
?/TD>   €
æ       æ
¦       ¦
¸       ¸
       ©
¤      ¤
°      °
÷      ÷
?/TD>   €
ƒ       &fnof;
½       ½
·      ·
ó       ó
‘      ‘
’      ’
“      “
”      ”
‰      &permil;
χ      χ
±      ±
£       £
§      §
¹       ¹
×      ×
…      …
←      ←
↑      ↑
→      →
↓      ↓
√      √
~       &sim;

<img> 插图 src align border height width alt(注释) hspace&vspace(距离左右&上下其它元素距离)
<bgsound> 背景音乐 src
<embed> 背景音乐 src

<a> 超链接 name href(http:// mailto: ftp:// news: gopher:// telnet://)(绝对路径书写<a href="/c|/XX/XX.jpg">即C:/xx/xx.jpg) target(=框架名称 _blank _parent _self _top)

<table> 表格标签 width height align valign bgcolor background border cellpadding(内文字距离表格线距离) cellspacing(表格线内外线距离) cols(行数)
<tr> 行标签 align valign width height bgcolor background
<td> 列标签 align valign width height bgcolor background colspan(跨行) rowspan(跨列)

<ul> 无序标签 type(=DISK实心圆 SQUARE小正方形 CIRCLE空心圆)
<ol> 有序标签 type(=1数字 A大写英文字母 a小写英文字母 I大写罗马字母 i小写罗马字母) start(=起始数)
<li> 序列

<dl> 定义列表标签
<dt> 小标题
<dd> 内容(内容首字位置与小标题最末字的下一字位置垂直相同)

<form> 表单标签
<input> 表明表单中类型 align type(类型) name size(宽度) value(默认值) maxlength(可输入的最大值)
type = text单行文本输入框 password密码 radio单选 checkbox复选 button按钮 submit提交 reset重置 hidden隐藏位 textarea多行文本框(wrap换行方式(off不自动换行 virtual自动换行不过若是使用者没有自行按下ENTER换行,送出资料时也视为没有换行 physical输入文字会自动换行,送出资料时会将荧幕上的自动换行视为换行效果送出) cols行数 rows列数) option下拉列表(size栏位大小 multiple允许复选)

<frameset> 框架划分 cols(左右分百分比或像素) rows(上下分百分比或像素) frameborder(框架边框) framespacing(框架间距离)
<frame> 框架 src(子页面地址) name scrolling(是否显示卷轴yes/no) noresize(禁止使用者调整框架大小) marginhight(框架高度部分边缘保留空间) marginwidth(框架宽度部分边缘保留空间)
<noframe> 对不支持框架的浏览器显示的内容写在这个标签内

图像链接：

</div>

超链接：

<div onclick="location.href='shouye.html'" class="skw-page__content">Jin进入网站</div>

锚点方面：

<a name="namea">只是起了名字</a>

<a href="shouye.html#asd" >进入网站指定位置</a>

<a name="namea">只是起了名字</a>

　锚点只是起到了定位的作用

posted @ 2020-07-20 14:02 Theone暗香阅读(153) 评论(0) 收藏举报

刷新页面返回顶部

Theone暗香

HTML基础学习内容

公告