本文主要是介绍年终总结之前端,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
时间一晃而过,转眼间20121已接近尾声。在这段试用期中可以说是有喜也有忧。和这里的伙伴们一起学习相处中,自己慢慢转变为学习者。
记得初这个学习团队时, 还很陌生、有点不习惯,后来几天慢慢的稍微好了一点,也在沉下心的进入学习氛围中,很久都没有的感觉。
正式开始学习前端已经过去一个多月的时间了。期间了解了HTML与CSS 的常用知识,静态网页也练习写了好几个。出现的问题确实不少,其中有几个比较大是问题。
1、对于比较复杂的网页,不能很好的去分析网页的结构和布局,存在不知道在什么时候该用什么标签的情况。虽然可以把网页的效果以静态的形式呈现出来,但是,明显感觉自己在结构上写的很复杂,嵌套了很多层。
2、CSS的好些属性不熟悉,记不住,只有多加练习记忆。
3、对于HTML与CSS部分的知识的综合运用和拓展应用都需要提升。
以下内容是关于这一个月以来的学习前端的个人总结,分为以下几个部分:
- 个人对学习的理解
- 一个月 的知识点
- 一些技巧
个人对学习方法的理解
论总结的重要性,我就信这一句话,言简意赅。
学习就是形成自己的知识体系,而总结是形成个人对知识理解的不可或缺的方法。
代码的知识点
*写的内容可能会有很多大白话,内容也可能杂乱无章,甚至可能有很多错误,毕竟我只是一只前端渣 *
以下的内容有引入其他的文章内容
HTML方面
1、命名(标签什么的看手册就好,写多了就记下了,以下是一些命名的参考)
商标: label
网站标志: logo
横幅广告: banner
搜索: search
搜索框: searchBox
登录: login
登录条:loginbar
工具条: toolbar
标签页: tab
列表: list
滚动: scroll
服务: service
热点:hot
新闻: news
下载: download
栏目标题: title
按钮: btn
页面结构
容器: container
页头:header
内容:content/container
页面主体:main
页尾:footer
导航:nav
侧栏:sidebar
栏目:column
页面外围控制整体布局宽度:wrapper
左右中:left right center
导航
导航:nav
主导航:mainbav
子导航:subnav
顶导航:topnav
边导航:sidebar
左导航:leftsidebar
右导航:rightsidebar
菜单:menu
子菜单:submenu
标题: title
摘要: summary
滚动:scroll
图标: icon
** 2、块级元素与行内元素**
-
行内元素:(display:inline)
和其他元素都在一行上;
高,行高及外边距和内边距不可改变;
宽度就是它的文字或图片的宽度,不可改变
内联元素只能容纳文本或者其他内联元素 -
常见的行内元素
a – 锚点
br – 换行
em – 强调
font – 字体设定(不推荐)
i – 斜体
img – 图片
input – 输入框
label – 表格标签
select – 项目选择
small – 小字体文本
span – 常用内联容器,定义文本内区块
strong – 粗体强调
sub – 下标
sup – 上标
textarea – 多行文本输入框
u – 下划线
-
块级元素:(display:block)
每个块级元素默认占一行高度,一行内添加一个块级元素后无法一般无法添加其他元素(float浮动后除外)。两个块级元素连续编辑时,会在页面自动换行显示。
-
常见的块级元素
address – 地址
div – 常用块级容易,也是CSS layout的主要标签
dl – 定义列表
fieldset – form控制组
form – 交互表单
h1 – 大标题
h2 – 副标题
h3 – 3级标题
h4 – 4级标题
h5 – 5级标题
h6 – 6级标题
hr – 水平分隔线
ol – 有序表单
p – 段落
table – 表格
ul – 无序列表
css
1、盒子模型
margin:盒子外边距
border:盒子边框
padding:盒子内边距
content:盒子内容
默认情况下box-sizing:content-box;css当中设置的盒子width、height就是值content的宽高,所以整个元素的的实际大小=border+padding+content width/height;
当box-sizing:border-box;css当中设置的盒子width、height=border+padding+contentwidth/height;
2、vertical-align
对于vertical-align,只有两点要说的:
1.设置相邻元素的对齐方式(例如图片与文字对齐,文字与小标对齐等)
2.对display:inline-block(table、table-cell)的元素生效。
3、 利用定位和margin、定位和transform垂直居中
✨学习感受:
在这一个月的学习中,我有坚持打卡和记录我的学习过程, 虽然通过一个月的努力,比之前有所提高,但是还是存在很多不足的地方,因为基础打的不够好,很多地方学习起来有些吃力,因为知识的不足,使得开始的学习有些紧凑,后来也跟上了学习步伐。
✨新的一年目标: .
过去的一年的整体上是紧张的、松弛的 ,所以对我来说这也是充满希望的一年。希望能够再接再砺,同时也加强自身的能力, 进一步提高自己知识技能 ,要继续 努力学习,,争取做出更大的成绩来。
我相信未来 前景是美好的,我期待2022有更好的发展。我会更加努力!
这篇关于年终总结之前端的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!