- 1：nth-of-type():选择器，这个类型【我来介绍下和nth-children的区别：nth-of-type()是用来选中同一类型的，就是同级中有其他的元素类型，但是不影响你选择同级的类型，nth-children，这个也是选择器，但是如果中间添加了同级不相等的元素，最后选择的结果就会受到影响】2:selection：字体选中，改变其选中后的状态颜色之类，但是只能有三个属性：（颜色/... 1：nth-of-type():选择器，这个类型【我来介绍下和nth-children的区别：nth-of-type()是用来选中同一类型的，就是同级中有其他的元素类型，但是不影响你选择同级的类型，nth-children，这个也是选择器，但是如果中间添加了同级不相等的元素，最后选择的结果就会受到影响】2:selection：字体选中，改变其选中后的状态颜色之类，但是只能有三个属性：（颜色/...
- 做考核任务查了下做图片轮播的资料，大概的思路是先做一个相框，然后做一个长的盒子，在盒子里面放上一排图片，通过控制盒子的位置变化来实现轮播效果。 看起来好像挺简单的，但是实际操作起来发现只是一个简单的盒子模型就遇到了几次坑<div class="page"> // 外层相框 <div class="box"> ... 做考核任务查了下做图片轮播的资料，大概的思路是先做一个相框，然后做一个长的盒子，在盒子里面放上一排图片，通过控制盒子的位置变化来实现轮播效果。 看起来好像挺简单的，但是实际操作起来发现只是一个简单的盒子模型就遇到了几次坑<div class="page"> // 外层相框 <div class="box"> ...
- 学习前端，前端就好比如盖房子~ html就充当了房子结构这部分，也是房子的基础。 css呢，就好比咱们房子的装修，墙面什么颜色，什么风格，什么地板...这些给房子改变风格，样式的就是css javascript呢，就好比这个房子的功能，房子需要制冷吧，需要暖气吧，也需要上下水吧。这些功能性的就相当于是javascript 好了，大概这样子开始了~follow me~ 学习前端，前端就好比如盖房子~ html就充当了房子结构这部分，也是房子的基础。 css呢，就好比咱们房子的装修，墙面什么颜色，什么风格，什么地板...这些给房子改变风格，样式的就是css javascript呢，就好比这个房子的功能，房子需要制冷吧，需要暖气吧，也需要上下水吧。这些功能性的就相当于是javascript 好了，大概这样子开始了~follow me~
- 前言学习了 CSS 选择器之后，我们会对选择器有个大致的认识，通过所学的知识，来实现导航栏下划线的跟随效果开始首先，我们先看效果图，如何使用 CSS 完成以下的结果呢？思考首先，要完成以上的动画效果，我们需要将 html 布局完成，然后我们知道，动画的效果是当我们从导航的左侧到右侧时，下划线从左往右移动。同理，当我们从导航的右侧到左侧时，下划线从右往左移动布局在这里使用列表布局1234567... 前言学习了 CSS 选择器之后，我们会对选择器有个大致的认识，通过所学的知识，来实现导航栏下划线的跟随效果开始首先，我们先看效果图，如何使用 CSS 完成以下的结果呢？思考首先，要完成以上的动画效果，我们需要将 html 布局完成，然后我们知道，动画的效果是当我们从导航的左侧到右侧时，下划线从左往右移动。同理，当我们从导航的右侧到左侧时，下划线从右往左移动布局在这里使用列表布局1234567...
- 清除input的默认样式：input { background： none; outline: none; border: none;}改变input中的placeholder的默认样式：input::-webkit-input-placeholder { color: rgba(49,49,49,1); font-size: .26rem;}清除button的默认样式：button { ... 清除input的默认样式：input { background： none; outline: none; border: none;}改变input中的placeholder的默认样式：input::-webkit-input-placeholder { color: rgba(49,49,49,1); font-size: .26rem;}清除button的默认样式：button { ...
- 我在做项目和维护他人写的代码过程中，越来越发现代码规范的重要性。规范的代码格式可以让后期在原代码上开发和维护更加高效。自己也看了很多的代码规范，所以想根据自己的所学整理一些内容。1. CSS样式的命名规范：采用英文字母、数字、以及 "_" 和 "-" 命名；以小写字母开头，不能以数字、 "_" 和 "-" 开头；命名形式：单字，连字符，下划线并遵守驼峰命名法；如图所示：2.CSS文本命名规范... 我在做项目和维护他人写的代码过程中，越来越发现代码规范的重要性。规范的代码格式可以让后期在原代码上开发和维护更加高效。自己也看了很多的代码规范，所以想根据自己的所学整理一些内容。1. CSS样式的命名规范：采用英文字母、数字、以及 "_" 和 "-" 命名；以小写字母开头，不能以数字、 "_" 和 "-" 开头；命名形式：单字，连字符，下划线并遵守驼峰命名法；如图所示：2.CSS文本命名规范...
- 我们在做项目的过程中，常常需要将一些图片做成背景图。但是在页面缩放的时候，会发现背景图并没有自适应去缩放。我在做项目的过程中也同样遇到了这个问题，查了一些资料发现通过padding可以实现背景图片高度按比例自适应。首先大概说一下原理：（1）高度百分比我们将高度设置成百分比时，其中的高度是基于父元素来定的，设置成50%，就是将该元素高度设置成父元素的高度值*50%。但是高度设置为百分比时，往往... 我们在做项目的过程中，常常需要将一些图片做成背景图。但是在页面缩放的时候，会发现背景图并没有自适应去缩放。我在做项目的过程中也同样遇到了这个问题，查了一些资料发现通过padding可以实现背景图片高度按比例自适应。首先大概说一下原理：（1）高度百分比我们将高度设置成百分比时，其中的高度是基于父元素来定的，设置成50%，就是将该元素高度设置成父元素的高度值*50%。但是高度设置为百分比时，往往...
- 我们在使用CSS做页面的样式修改时，经常会遇到滚动条的样式修改的问题。如下所示：有两种修改滚动条默认样式的方法。方法一：/* 滚动条样式 start */.jsyzmx .macro-table .res_data::-webkit-scrollbar{ /*滚动条整体样式*/ width:10px; height:10px;}/* 小方块 */.jsyzmx .macro-table .... 我们在使用CSS做页面的样式修改时，经常会遇到滚动条的样式修改的问题。如下所示：有两种修改滚动条默认样式的方法。方法一：/* 滚动条样式 start */.jsyzmx .macro-table .res_data::-webkit-scrollbar{ /*滚动条整体样式*/ width:10px; height:10px;}/* 小方块 */.jsyzmx .macro-table ....
- 参加了[全栈开发者] 【WEB前端全栈成长计划】剖析一下圣杯布局的实现原理巩固学习效果。 参加了[全栈开发者] 【WEB前端全栈成长计划】剖析一下圣杯布局的实现原理巩固学习效果。
- 盒模型代码简写 ：还记得在讲盒模型时外边距(margin)、内边距(padding)和边框(border)设置上下左右四个方向的边距是按照顺时针方向设置的：上右下左。具体应用在margin和padding的例子如下：margin:10px 15px 12px 14px;/*上设置为10px、右设置为15px、下设置为12px、左设置为14px*/ 通常有下面三种缩写方法:1、如果top、ri... 盒模型代码简写 ：还记得在讲盒模型时外边距(margin)、内边距(padding)和边框(border)设置上下左右四个方向的边距是按照顺时针方向设置的：上右下左。具体应用在margin和padding的例子如下：margin:10px 15px 12px 14px;/*上设置为10px、右设置为15px、下设置为12px、左设置为14px*/ 通常有下面三种缩写方法:1、如果top、ri...
- 大家都知道CSS的中文名称为层叠样式表，从名字中我们可以看出CSS的层叠性是CSS的重点特性。 CSS层叠性的概念：有多个选择器或一个选择器对某个或某几个标签中的多条样式进行选择，如果多个选择器都赋给某个或某几个标签相同属性，样式的作用范围发生了重叠。 大家都知道CSS的中文名称为层叠样式表，从名字中我们可以看出CSS的层叠性是CSS的重点特性。 CSS层叠性的概念：有多个选择器或一个选择器对某个或某几个标签中的多条样式进行选择，如果多个选择器都赋给某个或某几个标签相同属性，样式的作用范围发生了重叠。
- 所谓层叠性是指多种CSS样式的叠加，是浏览器处理冲突的一个能力,如果一个属性通过两个相同选择器设置到同一个元素上，那么这个时候一个属性就会将另一个属性层叠掉。比如先给某个标签指定了内部文字颜色为红色，接着又指定了颜色为蓝色，此时出现一个标签指定了相同样式不同值的情况，这就是样式冲突。一般情况下，如果出现样式冲突，则会按照CSS书写的顺序，以最后的样式为准。样式冲突，遵循的原则... 所谓层叠性是指多种CSS样式的叠加，是浏览器处理冲突的一个能力,如果一个属性通过两个相同选择器设置到同一个元素上，那么这个时候一个属性就会将另一个属性层叠掉。比如先给某个标签指定了内部文字颜色为红色，接着又指定了颜色为蓝色，此时出现一个标签指定了相同样式不同值的情况，这就是样式冲突。一般情况下，如果出现样式冲突，则会按照CSS书写的顺序，以最后的样式为准。样式冲突，遵循的原则...
- 首先我们先介绍下什么是盒子模型： 盒子模型，英文即box model。所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。 盒子模型允许我们在其它元素和周围元素边框之间的空间放置元素。 下面一个的图片我们讲解下盒子的... 首先我们先介绍下什么是盒子模型： 盒子模型，英文即box model。所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。 盒子模型允许我们在其它元素和周围元素边框之间的空间放置元素。 下面一个的图片我们讲解下盒子的...
- 书山有路勤为径，学海无涯苦作舟 ，大家好 我是运气男孩今天来说说CSS格式设置中有一些需要注意的地方，需要补注意的话很可能写出来的CSS文件不会被应用到网页中。1）每个标签的属性设置必须是被一对花括号包含。像下面的样子：标签{属性名称：属性值;}2）花括号中每个属性值赋值后必须用分号隔开。分号就相当于C#和C中的分号，指示一行语句的结束，加上分号就是和网页的解释器说明这个属性的赋值已经结束... 书山有路勤为径，学海无涯苦作舟 ，大家好 我是运气男孩今天来说说CSS格式设置中有一些需要注意的地方，需要补注意的话很可能写出来的CSS文件不会被应用到网页中。1）每个标签的属性设置必须是被一对花括号包含。像下面的样子：标签{属性名称：属性值;}2）花括号中每个属性值赋值后必须用分号隔开。分号就相当于C#和C中的分号，指示一行语句的结束，加上分号就是和网页的解释器说明这个属性的赋值已经结束...
- 在讲解CSS布局之前，我们需要提前知道一些知识，在CSS中，html中的标签元素大体被分为三种不同的类型：块状元素、内联元素(又叫行内元素)和内联块状元素。常用的块状元素有：<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>常用的内联元素有：<a>、<span>、<br>、<i>、<em>、<... 在讲解CSS布局之前，我们需要提前知道一些知识，在CSS中，html中的标签元素大体被分为三种不同的类型：块状元素、内联元素(又叫行内元素)和内联块状元素。常用的块状元素有：<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>常用的内联元素有：<a>、<span>、<br>、<i>、<em>、<...
上滑加载中
推荐直播
-
HDC深度解读系列 - Serverless与MCP融合创新，构建AI应用全新智能中枢2025/08/20 周三 16:30-18:00
张昆鹏 HCDG北京核心组代表
HDC2025期间，华为云展示了Serverless与MCP融合创新的解决方案，本期访谈直播，由华为云开发者专家(HCDE)兼华为云开发者社区组织HCDG北京核心组代表张鹏先生主持，华为云PaaS服务产品部 Serverless总监Ewen为大家深度解读华为云Serverless与MCP如何融合构建AI应用全新智能中枢
回顾中 -
苏州工业园区“华为云杯”2025人工智能应用创新大赛赛中直播2025/08/21 周四 16:00-17:00
Vz 华为云AIoT技术布道师
本期直播将与您一起探讨如何基于华为云IoT平台全场景云服务，结合AI、鸿蒙、大数据等技术，打造有创新性，有竞争力的方案和产品。
即将直播
热门标签