资讯详情

【网页前端】CSS之拓展样式以及Emmet语法

??这是前端网页,关注我学习前端不迷路 ??如果对你有帮助,给博主一个免费的表扬来鼓励 欢迎大家点赞评论收藏

??专栏介绍

前端网页 目前主要更新HTML,一起学习,一起进步。

??本期介绍

本期主要介绍CSS扩展风格和Emmet语法

文章目录

1. 拓展样式

1.1 盒子阴影

1.2 文本省略

1.3 盒宽高策略

2. Emmet 语法

2.1 简述

2.2 通用说明

2.3 页面生成

标签生成-toc" style="margin-left:40px;">2.4 HTML 标签生成

2.4.1 单标签生成

2.4.2 生成层级标签

2.5 CSS 快速生

我们可以给盒子加阴影。

格式:

当盒子里的文本太多时,我们可以使用它 CSS 文本省略了效果。

格式:

box-sizing 决定如何设置盒子实际宽度和高度的策略。

通常,为了稳定布局,如果盒子有内部距离,我们经常使用它 border-box 策略

准备代码 :

Emmet 语法是提高前端开发效率的开发工具。大多数编辑器都支持它,可以快速生成前端
广泛应用于开发。

Emmet 语法在分析时按在编辑器上 激活语法分析,生成快速代码。

格式: html:5
效果
格式:html:4s
效果:

 

有些 CSS 支持快速使用首字母缩写来快速生成:
例如:快速生成宽度属性 w200 。结果: width:200px;
快速生成行高属性 lh26 。 结果: line-height:26px;
快速生成背景颜色 bc 。 结果: background-color: #fff;
CSS 属性默认长度单位是 px ,可以直接指定其他单位:例如: lh26em

标签: 5w200kr碳膜电阻

锐单商城拥有海量元器件数据手册IC替代型号,打造 电子元器件IC百科大全!

锐单商城 - 一站式电子元器件采购平台