初级web前端必会知识点:HTML部分,看看你都会吗?
学习web前端,首先要学HTML。
关于HTML基础知识,首先是要掌握一些常用标签的使用和他们的各个属性,这些常用的标签我总结了一下有以下这些:
html:页面的根元素。head:页面的头部标签,是所有头部元素的容器。body:页面的主体标签,页面展现的内容就放置在这里面。title:页面的标题。
meta:位于文档的头部,提供页面的元信息,包括关键字、描述等等。link:定义文档与外部资源的关系,最常用的用途就是引入样式表。script:脚本标签,可以把js脚本代码放置在这个标签内,也可以使用这个标签的src属性引入一个外部标签。style:样式标签,可以把css代码写在这个标签中。
a:超链接,href属性代表要链接到的地方,target属性代表打开方式。img:图像标签,src属性表示图片的位置。form:表单元素,它内部的input、select、textarea等标签都是比较重要的。
div:定义文档中的分区或节,可以使用div来进行页面的布局等操作。另外还有ul、li、p、button、iframe、p、table等标签也很常用,nav、section、article、header、aside、footer等语义化标签也需要了解一下。
除了要了解上面这一些标签之外,还需要对一些新的HTML5的API有一定的了解:
audio、video标签。
Canvas:定义图形,比如图表和其他图像。
input标签的accept属性,email、phone、url等类型。
getElementByClassName根据class名来获取一个元素结点。
Multiple file selection多文件选择属性。
html的import、template
process标签,webGL等内容。
还有一些要知道的知识点:
1.doctype的作用。2.unicode、utf8等编码的原理和区别。
3.如何进行页面性能优化。
4.png、jpg、webp、gif等图片格式的不同的优势。
5.HTML行内元素与块级元素的区别。
6.移动web端开发常用head标签。7.web语义化。
8.浏览器中的缓存原理
初级web前端必会知识点:HTML部分,看看你都会吗?相关推荐
- 初级Web前端工程师是什么?初级Web前端工程师的技术体系有哪些?
今天小编要跟大家分享的文章是关于初级Web前端工程师是什么?初级Web前端工程师的技术体系有哪些?本篇文章为大家整理出来了Web前端工程师初级阶段需要掌握的内容,很全面,希望大家好好阅读,看看自己掌握 ...
- 尚硅谷新版Web前端HTML5+CSS3知识点集合篇【p1-p8】
尚硅谷新版Web前端HTML5+CSS3知识点集合笔记篇 尚硅谷新版Web前端HTML5+CSS3全套基础教程完整版(初学者零基础入门) p1(22:55) 一.软件的分类: 1.系统软件 -wind ...
- Web 前端必会的 PhotoShop 技能
Web 前端必会的 PhotoShop 技能 1.PhotoShop 的简介与安装 Adobe PhotoShop,简称"PS",是由 Adobe Systems 开发和发行的图像 ...
- Web前端必做笔记之一:let, var, const的区别
Web前端必做笔记之一:let, var, const的区别 <script>//var//没有块级作用域,只有函数作用域,支持变量提升console.log(a); var a = 10 ...
- Web前端必做笔记之一:Nunjucks基础使用(一)
Web前端必做笔记之一:Nunjucks基础使用 在上一节我们说到引入Nunjucks 现在我们用ctx来渲染模版 views下面的模版index.html <!DOCTYPE html> ...
- web前端必学功法之一:用户选择爱好
web前端必学功法之一:用户选择爱好 案例实现效果: 首先做这个页面效果,我们要把页面布局给写好,每个网站做好页面可以解决很大的问题. css代码,这里的页面采用Grid布局 <style> ...
- web前端必学功法之一:表单校验(1)
web前端必学功法之一:表单校验 案例效果: 这里的布局采用的是bootstrap布局 <div class="container" style="margin-t ...
- web前端必学功法之一:留言板
web前端必学功法之一:留言板 案例效果: css部分 <style>.container{width: 600px;}.mes-board{margin: 25px 0;padding: ...
- web前端必学功法之一:轮播图
web前端必学功法之一:轮播图 效果演示: <style>* {margin: 0;padding: 0;}/* 去除a标签的下划线 */a {text-decoration: none; ...
最新文章
- centos防火墙端口配置
- springBoot 打war包 程序包com.sun.istack.internal不存在的问题
- 五分钟内搭建的混沌电路
- java自定义注解简单小例子
- html5一年四季的变化,家乡四季的变化作文(精选5篇)
- 什么是AES算法?(整合版)
- SQLSERVER字符串截取------STUFF
- java mail outlook_已启用Outlook API邮件与邮箱用户
- css外观样式 1204
- 《MySQL DBA修炼之道》——1.7 MySQL复制架构
- Linux中创建 静态库和动态库(共享库) 本人亲测可行
- openstack trove实例状态转换条件--Mitaka版本
- linux 查看pgsql端口,如何查看postgres数据库端口
- 45、预制干粉灭火装置的设置要求
- 被顶级机构押注的6大新公链 公链之争谁更硬核?
- ArcGIS地理要素数据获取及地图制作
- 杭电计算机研究生复试题
- MiniUI Api 方法
- pointnet个人理解与实践
- 什么是蓝光危害?62471认证测试项目
热门文章
- redhat 添加ssh端口_Linux修改SSH远程登录端口 --服务器安全篇
- 线程打印_经典面试题——两个线程交替打印奇数和偶数
- mysql自定义函数to_date_mysql 之 str_to_date ()函数 和date_format()函数
- python虚拟人脸生成_Python-OpenCV人脸识别之数据集生成
- Pipeline As Code With Jenkins2.0
- Linux系统个性化设置
- JavaIO15FileReader和FileWriter源码分析及介绍使用
- 在Windows下删除Linux系统的方法
- 快照隔离(Snapshot Isolation)简单介绍和例子
- cisco6509 2811 配置备份