年终总结之前端

2024-04-29 21:58
文章标签 之前 年终总结

本文主要是介绍年终总结之前端,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

时间一晃而过,转眼间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有更好的发展。我会更加努力!

 
 
 
 

 

这篇关于年终总结之前端的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/947261

相关文章

springboot security之前后端分离配置方式

《springbootsecurity之前后端分离配置方式》:本文主要介绍springbootsecurity之前后端分离配置方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的... 目录前言自定义配置认证失败自定义处理登录相关接口匿名访问前置文章总结前言spring boot secu

mysql线上查询之前要性能调优的技巧及示例

《mysql线上查询之前要性能调优的技巧及示例》文章介绍了查询优化的几种方法,包括使用索引、避免不必要的列和行、有效的JOIN策略、子查询和派生表的优化、查询提示和优化器提示等,这些方法可以帮助提高数... 目录避免不必要的列和行使用有效的JOIN策略使用子查询和派生表时要小心使用查询提示和优化器提示其他常

golang1.23版本之前 Timer Reset方法无法正确使用

《golang1.23版本之前TimerReset方法无法正确使用》在Go1.23之前,使用`time.Reset`函数时需要先调用`Stop`并明确从timer的channel中抽取出东西,以避... 目录golang1.23 之前 Reset ​到底有什么问题golang1.23 之前到底应该如何正确的

day45-测试平台搭建之前端vue学习-基础4

目录 一、生命周期         1.1.概念         1.2.常用的生命周期钩子         1.3.关于销毁Vue实例         1.4.原理​编辑         1.5.代码 二、非单文件组件         2.1.组件         2.2.使用组件的三大步骤         2.3.注意点         2.4.关于VueComponen

一个瑞典游戏工作室决定离开索尼,之前和之后都发生了什么?

我们在前两篇中探究了国家政策、硬件基础与黑客文化如何让瑞典成为了游戏热土,而它充满地域特色的开发者社区与教育体系的构建,又是如何聚拢了游戏人才,让体系持续生长扩张。 除了大学、科技园和开发者之家外,我们此行从斯德哥尔摩到舍夫德到马尔默,还采访了三家知名工作室的创始人。它们一家产出如今罕见的双人合作游戏,还有一位特立独行的作者型开发者屡屡占据头条;一家贡献了现象级网红作品,当前在朝“正经向”大

数字时代,寻找新的生意增长点之前要做什么准备?

要做好最基础也最繁复的数据管理。 在竞争日益激烈的快消市场中,企业面临前所未有的挑战与压力。在这种高压环境下,数字化转型不再仅仅是选择,而是企业探索新的业务增长点、保持竞争优势的关键战略。然而,随着企业数字化进程的加速推进,业务系统持续生成的多样化与复杂化数据使得传统数据分析手段难以应对。因各系统间业财口径的不一致和数据维度的差异,企业在数据整合与分析过程中经常遭遇瓶颈,难以获得准确且具有前瞻性

汇总(二):之前

1.git命令行 2.Mysql基本sql语句 3.SpringBoot相关注解:(1)RestController (2)RequestMapping (3)Autowired (4)crossOrithVariabgin (5)PutMapping (6)PostMapping (7)RequestBody (8)RequestParam (9)PathVariable (10)Servi

HTTP协议中的短轮询、长轮询、长连接和短连接 序言 最近刚到公司不到一个月,正处于熟悉项目和源码的阶段,因此最近经常会看一些源码。在研究一个项目的时候,源码里面用到了HTTP的长轮询。由于之前没太

HTTP协议中的短轮询、长轮询、长连接和短连接 序言 最近刚到公司不到一个月,正处于熟悉项目和源码的阶段,因此最近经常会看一些源码。在研究一个项目的时候,源码里面用到了HTTP的长轮询。由于之前没太接触过,因此LZ便趁着这个机会,好好了解了一下HTTP的长长短短。 了解的方式主要都是LZ在网络上获取的,这里只是谈一下LZ对于这四种叫法最直观的理解。如果你之前不懂的话,可以帮你

day40-测试平台搭建之前端vue学习-Promise

目录 一、Promise介绍与使用         1.1.Promise是什么?         1.2.为什么要用Promise? 二、PromiseAPI         2.1.Promise构造函数:Promise(exctor){}         2.2.Promise.prototype.then方法:(onResolved,onRejected)=>{}

Unity Android 进阶之 【Android 添加一个启动动画】在Unity场景加载完之前,避免 【Unity 启动界面慢 黑屏时间长】的情况

Unity Android 进阶之 【Android 添加一个启动动画】在Unity场景加载完之前,避免 【Unity 启动界面慢 黑屏时间长的情况】 目录 Unity Android 进阶之 【Android 添加一个启动动画】在Unity场景加载完之前,避免 【Unity 启动界面慢 黑屏时间长的情况】 一、简单介绍 二、实现原理 三、效果简单预览 四、注意事项 五、该案