这篇博客详细记录了HTML的基本标签、表单与多媒体处理，CSS的文字、字体、背景和布局知识，JavaScript的基础语法、DOM操作及事件处理，以及jQuery的对象转换、元素操作和动画效果等内容，是前端初学者的宝贵学习资料。
HTML
一、基本标签
标题标签：<h1>标题标签</h1>
注释标签：<!-- -->
换行标签：<br/>
段落标签： <p>段落标签</p>
分隔线标签：<hr/>
加粗标签： <strong>加粗</strong> or <b>加粗</b>
倾斜标签： <em>倾斜</em> or <i>倾斜</i>
删除线标签： <del>删除线</del> or <s>删除线</s>
下划线标签： <ins>下划线</ins> or <u>下划线</u>
小号字体标签：<small>小号字体</small><br>
大号字体标签：<big>大号字体</big><br>
下标标签：5m<sup>2</sup><br> <!-- 5平方米 -->
上标标签：H<sub>2</sub>0<br> <!-- 化学式h2o -->
=====================================================================================
<!--无序列表-->
<ul>
<li>做真实的自己</li>
<li>用良心做教育</li>
</ul>
<!--有序列表-->
<ol>
<li>用心做事</li>
<li>创造价值</li>
<li>联手企业</li>
<li>协同高校</li>
</ol>
<!--自定义列表-->
<dl>
<dt>关注我们</dt>
<dd>新浪微博</dd>
<dd>官方微信</dd>
<dd>联系我们</dd>
</dl>
=====================================================================================
图片标签：<img src="img.jpg" width="70%" border="10"/>
alt是替换文本，当图片不能显示时，显示该文字
title是提示文本，把鼠标放到图片上，显示的文字
width和height，只需修改一个，另一个会等比例缩放
=====================================================================================
a标签
1.外部链接:网址要加http:// _blank新窗口打开页面 _self当前窗口打开页面
<a href="http://www.baidu.com" target="_blank">百度</a>
2.内部链接:网址没有http://，就是在打开自己做的首页文件
<a href="index.html" target="_blank">首页</a>
二、表单标签
单选框与多选框要有相同name值，才会是一组单选框，一组多选框
<form action="success.html">
用户名：<input type="text" name="username" value="请输入用户名"><br>
密码：<input type="password" name="pwd"><br>
单选：男<input type="radio" name="sexy">女<input type="radio" name="sexy"><br>
多选：爱好：吃饭<input type="checkbox" name="hobby">睡觉<input type="checkbox" name="hobby">打豆豆<input type="checkbox" name="hobby"><br>
表单提交：<input type="submit" name=""><br>
数据重置：<input type="reset" value name=""><br>
照片：<input type="file" name=""><br>
年龄范围：<input type="range" name=""><br>
邮箱: <input type="email" ><br>
生日：<input type="date" name=""><br>
时间: <input type="time"><br>
薪资：<input type="number" name=""><br>
电话：<input type="tel" name=""><br>
喜欢的颜色：<input type="color" name=""><br>
</form>
======================================================================================
表单下拉标签,style="resize: none;" 防止文本框被拖拽
<form action="success.html" method="post">
学历：
<select name="edu">
<option>研究生</option>
<option>本科</option>
<option>大专</option>
<option selected="selected">高职</option>
</select>
<br/>
<textarea name="tt" cols="50" rows="5" style="resize: none;">留言板</textarea>
<input type="submit">
</form>
三、多媒体标签
视频与音频标签，最好是mp4和mp3格式
<video src="media/mi.mp4" autoplay="autoplay" muted="muted" loop="loop" poster="media/mi9.jpg"></video>
<audio src="media/music.mp3" autoplay="autoplay" controls="control"></audio>
autoplay 自动播放
width 宽度
height 高度
loop 循环播放
muted 静音播放
四、特殊字符
复制的时候，注意要带分号
空格
< 小于号
> 大于号
& &
¥ 人民币¥
© 版权
® 注册商标
° 摄氏度
± 正负号
× 乘号
÷ 除号
五、语义化标签
<header> 头部标签
<nav> 导航标签
<article>内容标签
<section>定义文档某个区域
<aside> 侧边栏标签
<footer> 尾部标签
CSS
一、文字笔记
常见的块元素有<h1>~<h6>、<p>、<div>、<ul>、<ol>、<li>等，其中<div>标签是最典型的块元素
1.块元素独占一行
2.高度，宽度、外边距以及内边距都可以控制
3.宽度默认是容器（父级宽度)的100%
常见的行内元素有<a>、<strong>、<b>、<em>、<i>、<span>等，其中<span>标签是最典型的行内元素
1.行内元素一行可以显示多个
2.宽、高直接设置是无效的，默认宽度就是它本身内容的宽度。
常见的行内块元素有<img>、<input>、<td>等，它们同时具有块元素和行内元素的特点
1.和相邻行内元素在一行上，但是他们之间会有空白缝隙。一行可以显示多个
2.默认宽度就是它本身内容的宽度
3.高度，行高、外边距以及内边距都可以控制
元素显示模式的转换
1.display: block; 行内元素转成块级元素
2.display: inline; 块级元素转成行内元素
3.display: inline-block; 转换成行内块元素
=======================================================================================
CSS三大特性
层叠性：解决样式冲突问题，遵循就近原则，哪个样式离得近，就执行哪个，所以下面代码，粉色离得近就变粉色
<style>
div {
color: red;
}
div {
color: pink; /* 就近原则，div粉色离得近就变粉色 */
}
</style>
<body>
<div>我很厉害</div>
</body>
继承性：子标签继承父标签的某些样式，如文本颜色和字号
<style>
div {
color: red; /* 给div定义红色，也就是给div的儿子，p标签定义了红色，有继承性 */
font-size: 14px;
}
</style>
<body>
<div>
<p>我很牛逼</p>
</div>
</body>
优先级：同一个元素指定多个选择器，就会有优先级的产生
1.选择器相同，则执行层叠性，选择器不同，则根据选择器权重执行
2.!important 选择器权重无穷大
=======&#
最低0.47元/天 解锁文章
941
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
