2019前端「HTML+CSS」零基础入门之 HTML学习笔记
本文共 3342 字，大约阅读时间需要 11 分钟。
目录
2019前端「HTML+CSS」零基础入门
课时1 课程向导
前端三大基础语言：HTML CSS JavaScript
其次要学习：jQuery 网络 CSS3 H5 es6 webpack4.0 git 小程序 设计模式 VUE VUEX VUE源码 React Node.js Mongo DB数据库等等课时2 html 初级篇 - 基础标签
HTML（hyperText markup language 超文本标记语言）
<html>根标签</html>编辑浏览器的特性 展现给用户看
中文-乱码时使用 <meta charset="utf-8"> 即可解决
编码常用字符集：
gb2312(亚裔字符集不包括繁体)-->gbk(亚裔字符集包括繁体) unicode(万国码)-->升级码-->utf-8
<html lang="en,zh">language=English:告诉搜索引擎爬虫我们的网站是关于什么内容的</html>
SEO：搜索引擎优化技术，符合爬虫喜好
<meta content="服装" name="keywords"> <meta content="这是一个你穿了就不想脱的衣服" name="description"><title>网页标题标签</title><p>this is a paragraph 段落标签</p><h1>标题</h1>
<h2>标题</h2> .逐 .次 .小 <h6>标题</h6>
<strong>加粗</strong>
<em>斜体</em> <del style="color: #CCCCCC;">document 依次减小，加粗段落展示 标签嵌套 容器(绑定化操作)：
课时3 html 进阶篇 - 高级标签
<div style="width: 100px;height: 100px;background-color: red;">kjbvjbxASDBcsd bnxcbvnxbvcnxvzvbhjvsadfv</div>
显示：不会自动换行，会越出红色矩形，因为一个单词无法分割 空格->英文单词分隔符 html编码： 代表空格 接下来我要给大家讲解一个标签，叫<div> (<div>) <br>换行标签 标签正常来说成对出现，为了修饰包裹的内容；不需要修饰的标签->单标签 <hr>代表水平线有序列表：
<ol> <li>列表项1</li> <li>列表项2</li> <li>列表项3</li> </ol> 默认阿拉伯数字作为序号； <ol type="1"/"a"/"A"/"i"/"I"(排序标号类型) start="117(从第几个开始)"> <li>列表项1</li> <li>列表项2</li> <li>列表项3</li> </ol> <ol reversed="reversed"(倒着排序)> <li>列表项1</li> <li>列表项2</li> <li>列表项3</li> </ol>
无序列表：
<ul type="disc(默认)/square/circle"> <li>列表项1</li> <li>列表项2</li> <li>列表项3</li> </ul>
一个大功能有很多个功能子项组成，例如信息导航栏。追求可维护性、通用性。
document
- 天猫
- 聚划算
- 天猫超市
img标签
<img src="images/icon.png" style="width: 200px;" >
alt="图片占位符：这是出错后图片的位置上显示的内容" title="图片提示符"实现方式：
1.网上url 2.本地的绝对路径 3.本地的相对路径a标签
<a href="hyperText reference：超文本引用" style="...">a标签</a> 在新标签页中打开： <a href="hyperText reference：超文本引用" style="... target="_blank" ">a标签</a> anchor -- 锚(原始作用：作为锚点记录位置)demo1demo2find demo1find demo2
固定导航：
document demo1demo2find demo1 find demo2
<a href=""></a>
1.超链接 2.锚点 3.打电话(href="tel:138XXXXXXXX")、发邮件(href="mailto:邮箱地址") 4.协议限定符(<a href="javascript:while(1){alert('让你手欠')}">点我试试呀</a>)
<form>占html的重要性的50%</form>
form表单：从前端往后端发送数据 <form method="get/post(发送数据的方式)" action="http://www...(发送地址)"></form>示例：
document
实现鼠标聚焦时搜索框内文字消失，鼠标移开文字出现；输入内容移开显示输入内容：
1.
2.聚焦
3.输入
4.移开
5.删除
6.移开
document
单选框：
复选框：
默认选中checked：
text
下拉菜单：
document Province
转载地址：http://wefen.baihongyu.com/
你可能感兴趣的文章
linux、mysql、nginx、tomcat 性能参数优化
查看>>
Nginx使用Linux内存加速静态文件访问
查看>>
杀掉nginx进程后丢失nginx.pid，如何重新启动nginx
查看>>
nginx另类复杂的架构
查看>>
Nginx流量复制/AB测试/协程
查看>>
使用NTP服务器完美解决VMware Linux时间无法同步问题
查看>>
机器学习笔记(3)---K-近邻算法(1)---约会对象魅力程度分类
查看>>
机器学习笔记(4)---K-近邻算法(2)---使用sklearn中的KNN算法
查看>>
数据结构——外部排序
查看>>
UNIX网络编程——System V 消息队列
查看>>
信号量、互斥锁，读写锁和条件变量的区别
查看>>
UNIX网络编程——Posix共享内存区和System V共享内存区
查看>>
js循环语句
查看>>
js中时钟的写法
查看>>
js事件冒泡
查看>>
京东金融曹鹏：通过JDD大赛，实现“比你更懂你”的极致价值，让金融更简单，更平等
查看>>
HTML我的家乡杭州网页设计作业源码(div+css)~ HTML+CSS网页设计期末课程大作业 ~ web前端开发技术 ~ web课程设计网页规划与设计 ~HTML期末大作业
查看>>
HTML网页设计期末课程大作业~动漫樱桃小丸子5页表格div+css学生网页设计作业源码
查看>>
HTML学生网页设计作业成品~化妆品官方网站设计与实现(HTML+CSS+JS)共8个页面
查看>>
web课程设计网页规划与设计~在线阅读小说网页共6个页面(HTML+CSS+JavaScript+Bootstrap)
查看>>