html笔记

最新推荐文章于 2024-01-18 19:00:14 发布

lq_ioi_pl

最新推荐文章于 2024-01-18 19:00:14 发布

阅读量73

点赞数

文章标签： html 笔记前端

本文链接：https://blog.csdn.net/lq_ioi_pl/article/details/131870717

版权

计算机基础知识
硬件：控制器、运算器、输出设备、输入设备、存储设备（内存（读写快，存储空间小）、硬盘读写慢，存储空间大）

软件：系统软件：windows、linux

应用软件：微信、QQ

b/s:---browser浏览器 跨平台、无需安装、不需要更新

c/s:---c:client客户端不跨平台、按照、更新

S:server服务器大型专业应用、对安全要求比较高（导弹系统）

Html:超文本标记语言，描述王亚伟的语言超：超链接，不仅有文字，还有图片、音频、视频从一个页面跳转到另一个页面

标记：文本要变成超文本，就需要各种标记语言

Html---结构

Css---表现

Javascript----行为

html基础语法：

<起始标签>标签体（内容）</结束标签>-----双标签

大小写不敏感---建议小写

<标签 />-----单标签

<marquee loop="1" bgcolor="pink">标签体</marquee>--用来插入一段滚动的文字

<input type="password"/>输入（表单输入）

Loop:设置marquee滚动的次数，如果未设置指定值，默认值为-1，表示marquee将表示连续滚动

Bgcolor:设置marquee滚动的背景颜色

type="password"使表单中输入的东西隐秘起来

标签也叫元素

html标签可以相互嵌套

标签网址：w3c官网html标准-----https://html.spec.whatwg.org/multpage/

WDM

属性：给标签添加附加信息的

属性名="属性值"

特殊的： disabled="disabled"可以简写为disabled

骨架：最外围一定是<html>标签体</html>

<html>

<head>

</head>

<body>

</body>

</html>

之后的所有操作都在body里面写，body相当于浏览器里的可视区域

按出英文的”!“后回车---自动生成骨架

UTF-8：万国码

"Ctrl+/":快捷注释

标题标签：h1~h2--逐级减小--独占一行

段落标签：<p>段落文字</p>

文本格式化标签：<strong>文字</strong>

<b>文字</b>---将文字加粗

<i>文字</i>---将文字倾斜

<s>文字</s>----将文字打上横线

x<sub>2</sub>---以2为底的x

x<sup>2</sup>---x的2次方

<ins>文字</ins>---将文字划下划线

换行标签及水平线标签：<br />(单标签）---换行

<hr/>---水平线

图片：属性---scr指向图片地址的

---alt在图片地址发生错误的时候用来对图片的做出提示的

----"./"---找同一级的图片

---"../"---找上一级的同一级图片

---title=”文字“---当鼠标放在图片上时显示文字

---px（像素单位）---width="800px"----设置宽度（高度自由缩放）

---- border="2px"设置边框

<img src="../">文字----文字和图片向下对齐

<img src="../" align="center">文字----文字和图片居中对齐

视频

<video src="images/" controls></video>----不会重复播放

<video src="images/" controls loop></video>----重复播放

----controls是controls=“controls”的缩写

---loop是loop="loop"的缩写

<video src="images/" controls loop autoplay muted></video>-----静音自动播放

音频

视频和音频都要有controls才能正常播放

超链接

<a href="路径">文字</a>----点击文字进行跳转，不能回到原页面

<a href="路径" target="_blank">文字</a>----target---控制链接打开方式

<a href="https://www.baidu.com" target="_blank">文字</a>----百度

锚链接

<h1 id="one">文字</h1>---一个元素只能有一个id，同一网页内，id不能相同

特殊字符

<p>&alt;</p>----小于号

<p>></p>----大于号

<p> </p>-----空格

<p>   </p>-----多个空格

有序列表

<ol>

</ol>-------显示为：1、文字1

2、文字2

3、文字3

</ol>-------显示为：1、文字i

2、文字ii

3、文字iii

<li>里什么都可以放

无序列表

<ul>

</ul>

自定义列表

<dl>

<dl>--------显示为：文字1

文字2

框架（在嵌入时应用）

Iframe与target配套使用

表单

所有表单都要放到form中

<form action="路径">

用户名：<input type="text" name="userName" value="文字" disabled placeholder="请输入正确的用户名">-----value设置默认用户名，可以改----加上disabled则不能改----placeholder在输入用户名的框里显示后面的文字，即提示词

密码：<input type="password">

<input type="radio" name="文字1" value="女" autocomplete="on"> 女----autocompele只有on和off,表示是否记录上一次的记录

<input type="radio" name="文字2" value="男">男----在男和女中选一个----文字1和文字2相同为单选，必须写value----用name确定为一组

爱好

<input type="checkbox" name="文字" value="sing">唱歌

<input type="checkbox" name="文字" value="dance">跳舞

<select name="文字" id="" multiple>

<option value="西安">西安</option>

<option value="南京">南京</option>

<option value="成都">成都</option>-----在三个城市中选一个

</select>

<textarea name="文字" id="" cols="30" rows="10" maxlength="20"></textarea>----出现一个可输入内容的框，cols和rows表示行和列可输入的字数,maxlength表示最多可输入的字数

<input type="file" name="文字">---选择文件，只能选一个

<input type="submit" value="提交">----和button一样

<button>提交</button>

</form>

表单标签

Table的属性

Cellspacing:单元格与单元格之间的间距

Border:表格的边框

tbody的属性：Align="center" valign="middle"---表格中的字水平居中

单元格合并：跨行和并------<td rowspan="2"></td>-----将第一行和第二行的单元格合并

跨列合并----<td colspan="2"></td>-----将第一行和第二行的单元格合并

Bgcolor="pink"-------设置单元格背景

无语义标签（div\span)

div标签-----可以识别任何标签------拿去划分区域------独占一行

span标签-------一行多个（小容器）

元素显示模式

块元素----独占一行，宽、高、内外边距可以设置-----div\h1-h6\li

行内元素---一行多个，宽高、内外边距设置无效------span\a\

行内块元素--------可以一行多个，还可以设置宽高、内外边距-----img

一个网页中的id值不能重复，一个元素只能有一个id

class：分类、配合层叠样式表、一个网页中有多个类名相同的元素、一个元素可以有多个类名

全局属性

Title-----鼠标悬浮时，显示提示词

Tabindex="1"----指示其元素是否可以聚焦，以及它是否/在何处参与顺序键盘导航（通常使用Tab键，因此得名）。

Spellcheck="true/false"---------拼写检查

Accesskey--------s设置快捷键的属性----谷歌浏览器里：配合alt按键，才能完成

Contenteditable="true/false"------------设置元素中内容是否可以更改

Dir--------设置文字输入方向

lq_ioi_pl

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
html笔记

--px（像素单位）---width="800px"----设置宽度（高度自由缩放）----"./"---找同一级的图片。-----value设置默认用户名，可以改----加上disabled则不能改----placeholder在输入用户名的框里显示后面的文字，即提示词。单元格合并：跨行和并------<td rowspan="2"></td>-----将第一行和第二行的单元格合并。Contenteditable="true/false"------------设置元素中内容是否可以更改。
复制链接

扫一扫