前端开发代码规范语义化规则

最新推荐文章于 2024-09-11 20:48:42 发布

瑆箫

最新推荐文章于 2024-09-11 20:48:42 发布

阅读量95

点赞数

文章标签：代码规范

本文链接：https://blog.csdn.net/mo3408/article/details/129138967

版权

web前端技术同时被 2 个专栏收录

274 篇文章 12 订阅 ¥129.90 ¥299.90

订阅专栏

超级会员免费看

web

205 篇文章 8 订阅 ¥129.90 ¥299.90

订阅专栏

超级会员免费看

本文探讨了前端开发中的代码规范，强调了语义化的重要性。语义化的HTML标签有助于提升网页的可读性和机器理解性，促进团队协作。通过将页面视为一本书，使用如`<header>`、`<h1>`、`<h2>`、`<p>`等标签来表达内容结构，可以实现更好的网页结构和SEO效果。

摘要由CSDN通过智能技术生成

语义化

没有 CSS 的 HTML 是一个语义系统而不是 UI 系统。

通常情况下，每个标签都是有语义的，所谓语义就是你的衣服分为外套，裤子，裙子，内裤等，各自有对应的功能和含义。所以你总不能把内裤套在脖子上吧。-- 一丝

此外语义化的 HTML 结构，有助于机器（搜索引擎）理解，另一方面多人协作时，能迅速了解开发者意图。

常见标签语义

标签	语义
`<p>`	段落
`<h1> <h2> <h3> ...`	标题
`<ul>`	无序列表
`<ol>`	有序列表
`<blockquote>`	大段引用
`<cite>`	一般引用
`<b>`

了解本专栏

订阅专栏解锁全文

超级会员免费看

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

瑆箫

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

订阅专栏

ui设计师要会html和css吗,写给设计师的编程基础：HTML 和 CSS 是什么？

weixin_28862113的博客

06-07

977

有不少同学讨论过，在找工作时老是看见招聘信息要求懂代码，觉得是不是要懂代码才可以当UI设计师，为什么做设计还需要编程？为了解决这个问题，我们就来分享一个有关设计师和 “编程” 的系列干货，用所有人能看懂的讲解方式，帮助大家掌握这门基础，再也不会被这类招聘要求难倒。UI设计师和编程的关系理论上来说，术业有专攻，现代团队只有分工明确才有生产效率。但为什么要求设计师也要懂「编程」呢？简单概括就是代码...

前端开发知识汇总系列四（HTML结构化、语义化）

WindfallSheng的博客

01-16

296

结构化为什么我们需要结构化? 因为没有元素给内容结构，所以浏览器不知道什么是标题，什么是段落。此外：用户在阅读网页时，往往会快速浏览以查找相关内容，经常只是阅读开头的标题（我们通常在一个网页上会花费很少的时间spend a very short time on a web page)。如果用户不能在几秒内看到一些有用的内容，他们很可能会感到沮丧并离开。对您的网页建立索引的搜索引擎将标题的内容视为影响网页搜索排名的重要关键字。没有标题，您的网页在SEO（搜索引擎优化）方面效果不佳。 ...

参与评论您还未登录，请先登录后发表或查看评论

没有CSS的网页会怎样

qf2019的博客

06-18

1397

首先，我们来看一下CSS是什么?CSS称为层叠样式表，为HTML标记语言提供了一种样式描述，定义了其中元素的显示方式。CSS在Web设计领域是一个突破，利用它可以实现修改一个小的样式更新与之相关的所有页面元素。同时，CSS可以满足HTML自身的不足，丰富的样式便于使用和修改。如果网页中没有CSS，每个浏览器都按照自己的解析形式来解析每个网页，那么我们现在所看到的页面将是一盘散沙，毫无美感可言。同...

前端代码规范

不负光阴不负自己，不负被爱不负所爱

02-04

1080

使用，连接符例如：使用命名例如：文件命名：组件命名：使用，下划线拼接，例如：使用命名动词+名词形式尽量使用箭头函数例如：构造函数使用函数方法常用的动词: 六、类命名、类文件名 1、类命名（api 接口参考）使用命名 api 接口：store 以 use 开头 + 业务名称 + store eg : 2、interface 命名 interface 以大写 I 开头 eg: 3、enum 命名 enum 以 Enum 结尾 eg: 八、组件建议代码尽量控制在 500 以内

2024最新阿里代码规范（前端篇）

2401_84092809的博客

04-18

1198

必须使用 camelCase 驼峰命名必须指定类型必须加上注释，表明其含义必须加上 required 或者 default，两者二选其一如果有业务需要，必须加上 validator 验证props: {// 组件状态，用于控制组件的颜色status: {return [‘succ’,‘info’,‘error’== -1},// 用户级别，用于显示皇冠个数整理面试题，不是让大家去只刷面试题，而是熟悉目前实际面试中常见的考察方式和知识点，做到心中有数，也可以用来自查及完善知识体系。

【前端开发必备小技巧】前端代码规范Vue篇

stc_ljc的博客

08-31

1318

Vue 项目规范以 Vue 官方规范中的A规范为基础，在其上面进行项目开发，故所有代码均遵守该规范。请仔仔细细阅读 Vue官方规范，切记，此为第一步。

前端开发规范详解

热门推荐

柯晓楠

01-21

1万+

引言如果开发团队就一个人的话，那么自己写的代码就是规范，随着公司业务的扩展，团队不断壮大，这时候就要开始考虑协作和编码规范问题了。一个人走的更快，一群人可以走的更远，前提是统一的策略，还要不断地反省和优化。什么是规范？规范，名词意义上：即明文规定或约定俗成的标准，如：道德规范、技术规范等。动词意义上：是指按照既定标准、规范的要求进行操作，使某一行为或活动达到或超越规定的标准，如：规范管理、规范操作。为什么要有规范？降低新成员融入团队的成本, 同时也一定程度避免挖坑；提高开发效率、团队协作

【记录】前端代码规范规范

qq_41287158的博客

04-21

3235

1. 命名规范 a.ClassName命名 ClassName的命名应该尽量精短、明确，必须以字母开头命名，且全部字母为小写，单词之间统一使用下划线 “_” 连接当子孙模块超过4级或以上的时候，可以考虑在祖先模块内具有识辨性的独立缩写作为新的子孙模块  <div class="tenant"> <div class="tenant_cover"></div>

vue前端开发代码规范(最新)

nelyo的博客

11-01

3046

一、命名规范市面上常用的命名规范： camelCase（小驼峰式命名法 —— 首字母小写） PascalCase（大驼峰式命名法 —— 首字母大写） kebab-case（短横线连接式） Snake（下划线连接式） 1.1 项目文件命名 1.1.1 项目名全部采用小写方式，以短横线分隔。例：my-project-name。 1.1.2 目录名参照项目命名规则，有复数结构时，要采用复数命名法。例：docs、assets、components、directives、mixins、utils、view

前端开发规范V2023.5

qq575792372的博客

04-11

3085

前端开发规范

阿里前端开发规范.pdf

05-08

阿里前端开发规范是一份详尽的指南，旨在提高团队协作效率和代码质量。这份规范涵盖了多个方面的编程规约，包括命名规范、HTML 规范、CSS 规范、LESS 规范以及 JavaScript 规范，并专门针对 Vue 项目提出了特别的...

前端开发技术规范（命名规范、HTML 规范、语义化标签。。。）

06-02

在前端开发中，遵循一套规范化的技术标准是至关重要的，这不仅有利于代码的整洁和可读性，还能提高团队协作的效率，降低维护成本。本文将详细阐述前端开发中的命名规范、HTML规范以及语义化标签的应用。首先，命名...

【JS代码规范】如何优化if-else代码规范

qq_43720551的博客

09-11

569

用策略模式优化许多if-else 判断的代码。增强可读性

5020-微信小程序基于JAVA微信点餐小程序设计+ssm（源码+数据库+lun文）.zip

09-15

基于 Flask 的数字猜谜系统.zip

09-15

该项目是一个基于 Flask 框架的数字猜谜游戏。通过 Flask 搭建了一个 Web 应用，用户可以通过界面参与数字猜谜游戏。项目简单易懂，适合初学者了解 Flask 框架的基本使用以及 Web 开发的基础知识。同时，该项目也有一定的娱乐性质，可以提供给用户休闲娱乐的时光。 1、资源项目源码均已通过严格测试验证，保证能够正常运行； 2、项目问题、技术讨论，可以给博主私信或留言，博主看到后会第一时间与您进行沟通； 3、本项目比较适合计算机领域相关的毕业设计课题、课程作业等使用，尤其对于人工智能、计算机科学与技术等相关专业，更为适合； 4、下载使用后，可先查看ReaDME.md文件（如有），本项目仅用作交流学习参考，请切勿用于商业用途。

5206-微信小程序投票评选系统的设计与实现ssm（源码+数据库+lun文）.zip

09-15

PeaZip 64 bit 9.9.1 free 解压缩工具杜绝360垃圾