- 语义化，让你的网页更好的被搜索引擎理解 学习html标签过程中，主要注意两个方面的学习：标签的用途、标签在浏览器中的默认样式 标签的用途：我们学习网页制作时，常常会听到一个词，语义化。那么什么叫做语义化呢，说的通俗点就是：明白每个标签的用途（在什么情况下使用此标签合理）比如，网页上的文章的标题就可以用标题标签，网页上的各个栏目的栏目名称也可以使用标题标签。 语义化，让你的网页更好的被搜索引擎理解 学习html标签过程中，主要注意两个方面的学习：标签的用途、标签在浏览器中的默认样式 标签的用途：我们学习网页制作时，常常会听到一个词，语义化。那么什么叫做语义化呢，说的通俗点就是：明白每个标签的用途（在什么情况下使用此标签合理）比如，网页上的文章的标题就可以用标题标签，网页上的各个栏目的栏目名称也可以使用标题标签。
- 单条件筛选单个的not写法：/*选中非段落元素*/:not(p){ }在前端项目开发过程中，如果希望某个样式不作用到选择器上，可以使用:not(选择器），如：<input type="text" value="1" /><input type="text" value="2" /><input type="text" class="no-red" value="3"/>input[type... 单条件筛选单个的not写法：/*选中非段落元素*/:not(p){ }在前端项目开发过程中，如果希望某个样式不作用到选择器上，可以使用:not(选择器），如：<input type="text" value="1" /><input type="text" value="2" /><input type="text" class="no-red" value="3"/>input[type...
- 背景透明，文字不透明的解决方法：为元素添加一个绝对定位的子元素，设置大小和该元素一样，把半透明加在绝对定位元素上作为遮罩，z-index设置到最底部，达到背景半透明效果。使用CSS3新属性rgba。实现透明的方法：css3的opacity，取值从 0 到 1，如opacity : 0.5，IE9及以上版本和标准浏览器都支持。IE8 以及更早的版本支持替代的 filter 属性，例如：filt... 背景透明，文字不透明的解决方法：为元素添加一个绝对定位的子元素，设置大小和该元素一样，把半透明加在绝对定位元素上作为遮罩，z-index设置到最底部，达到背景半透明效果。使用CSS3新属性rgba。实现透明的方法：css3的opacity，取值从 0 到 1，如opacity : 0.5，IE9及以上版本和标准浏览器都支持。IE8 以及更早的版本支持替代的 filter 属性，例如：filt...
- 大家好，欢迎来到雄雄的小课堂，前面，我们将CSS的变形和过渡都整理了，有需要的可以移步这里看：CSS3中的动画示例CSS3的几个变形案例……今天，我们来看看CSS3的动画。CSS3使用动画分为两个步骤：1.通过类似flash动画的关键帧来声明一个动画。2.在animation属性中调用关键帧声明的动画，实现一个更为复杂的动画效果。接下来我们具体来看看CSS3是如何实现动画的？ 01设置关键帧... 大家好，欢迎来到雄雄的小课堂，前面，我们将CSS的变形和过渡都整理了，有需要的可以移步这里看：CSS3中的动画示例CSS3的几个变形案例……今天，我们来看看CSS3的动画。CSS3使用动画分为两个步骤：1.通过类似flash动画的关键帧来声明一个动画。2.在animation属性中调用关键帧声明的动画，实现一个更为复杂的动画效果。接下来我们具体来看看CSS3是如何实现动画的？ 01设置关键帧...
- 大家好，欢迎来到雄雄的小课堂，上一期我们分享了几个CSS变形案例，大家还记得有哪几个吗？原文在这里：CSS3的几个变形案例……今天，我们来看看CSS的过渡：过渡简单的来讲，就是元素由一种状态（样式）转变到另一种时的过程，可以称之为过渡。我们来口头举个例子：某div初始的宽和高均为200px,背景色为红色（red）,当鼠标悬浮时，我们想让其原地转一圈，背景色为黄色(yellow),那么由红色转... 大家好，欢迎来到雄雄的小课堂，上一期我们分享了几个CSS变形案例，大家还记得有哪几个吗？原文在这里：CSS3的几个变形案例……今天，我们来看看CSS的过渡：过渡简单的来讲，就是元素由一种状态（样式）转变到另一种时的过程，可以称之为过渡。我们来口头举个例子：某div初始的宽和高均为200px,背景色为红色（red）,当鼠标悬浮时，我们想让其原地转一圈，背景色为黄色(yellow),那么由红色转...
- 编辑期末考试——H5完成方式——练习题前言本练习训练了孩子们的栅格化布局，H5标签，CSS样式，并对列表与菜单进行了强化训练。使孩子们更好的掌握H5布局，为后面的框架教学打好基础。素材下载地址：链接：https://pan.baidu.com/s/1VBniK_1n2xw8oHm1PMZ4iw 提取码：1111重点单词涉及：1、box-sizing: border-box;免计算边框像... 编辑期末考试——H5完成方式——练习题前言本练习训练了孩子们的栅格化布局，H5标签，CSS样式，并对列表与菜单进行了强化训练。使孩子们更好的掌握H5布局，为后面的框架教学打好基础。素材下载地址：链接：https://pan.baidu.com/s/1VBniK_1n2xw8oHm1PMZ4iw 提取码：1111重点单词涉及：1、box-sizing: border-box;免计算边框像...
- 欢迎关注公众号:TestingStudio,学习更多测试开发必备技能说明：本篇博客基于selenium 4.1.0 selenium-css定位element_css = driver.find_element(By.CSS_SELECTOR, 'css表达式') css定位说明selenium中的css定位，实际是通过css选择器来定位到具体元素，css选择器来自于css语法 css定位优... 欢迎关注公众号:TestingStudio,学习更多测试开发必备技能说明：本篇博客基于selenium 4.1.0 selenium-css定位element_css = driver.find_element(By.CSS_SELECTOR, 'css表达式') css定位说明selenium中的css定位，实际是通过css选择器来定位到具体元素，css选择器来自于css语法 css定位优...
- 前言Hello！小伙伴！首先非常感谢您阅读海轰的文章，倘若文中有错误的地方，欢迎您指出～哈哈 自我介绍一下昵称：海轰标签：程序猿一只｜C++选手｜学生简介：因C语言结识编程，随后转入计算机专业，有幸拿过国奖、省奖等，已保研。目前正在学习C++/Linux（真的真的太难了～）学习经验：扎实基础 + 多做笔记 + 多敲代码 + 多思考 + 学好英语！日常分享：微信公众号【海轰Pro】记录生活、... 前言Hello！小伙伴！首先非常感谢您阅读海轰的文章，倘若文中有错误的地方，欢迎您指出～哈哈 自我介绍一下昵称：海轰标签：程序猿一只｜C++选手｜学生简介：因C语言结识编程，随后转入计算机专业，有幸拿过国奖、省奖等，已保研。目前正在学习C++/Linux（真的真的太难了～）学习经验：扎实基础 + 多做笔记 + 多敲代码 + 多思考 + 学好英语！日常分享：微信公众号【海轰Pro】记录生活、...
- 布局特点：内容区分为左中右三部分，其中左右两部分的宽度固定，中间部分的宽度随视口变化 优缺点圣杯布局用定位+位移，代码较复杂，但是dom结构清晰双飞翼布局，不使用定位，换来dom结构的不友好 圣杯：多个div标签中间宽度center设置为100%，外面的content设置padding，给两端留出位置，留的宽度刚好为左右固定的宽度；center,left,right设置浮动,floor设置... 布局特点：内容区分为左中右三部分，其中左右两部分的宽度固定，中间部分的宽度随视口变化 优缺点圣杯布局用定位+位移，代码较复杂，但是dom结构清晰双飞翼布局，不使用定位，换来dom结构的不友好 圣杯：多个div标签中间宽度center设置为100%，外面的content设置padding，给两端留出位置，留的宽度刚好为左右固定的宽度；center,left,right设置浮动,floor设置...
- 相信刚开始学习开发小程序的初学者一定对界面的布局很困扰，不知道怎么布局，怎么摆放位置，其原因是不了解CSS样式的属性，所以，今天这篇文章，给大家普及一下相关的知识。 说起CSS布局，首先要讲解的就是FLex布局，这个可以说是一个万能钥匙，遇到什么复杂的布局，都可以通过Flex布局搞定，为了方便大家理解Flex属性，我将会一步步解析FLex的属性，并附上效果图。 相信刚开始学习开发小程序的初学者一定对界面的布局很困扰，不知道怎么布局，怎么摆放位置，其原因是不了解CSS样式的属性，所以，今天这篇文章，给大家普及一下相关的知识。 说起CSS布局，首先要讲解的就是FLex布局，这个可以说是一个万能钥匙，遇到什么复杂的布局，都可以通过Flex布局搞定，为了方便大家理解Flex属性，我将会一步步解析FLex的属性，并附上效果图。
- <!DOCTYPE html><html><head> <meta charset="utf-8"> <title>CSS 分组和嵌套</title> <style> h1, h2, p { color: green; } .marked { background-color: red; } ... <!DOCTYPE html><html><head> <meta charset="utf-8"> <title>CSS 分组和嵌套</title> <style> h1, h2, p { color: green; } .marked { background-color: red; } ...
- 大家好，我是coderBin js 和 css 是如何影响DOM树构建的？先做个总结，然后再进行具体的分析：CSS不会阻塞DOM的解析，但是会影响JAVAScript的运行，javaSscript会阻止DOM树的解析，最终css（CSSOM）会影响DOM树的渲染，也可以说最终会影响渲染树的生成。接下来我们先看javascript对DOM树构建和渲染是如何造成影响的，分成三种类型来讲解： Ja... 大家好，我是coderBin js 和 css 是如何影响DOM树构建的？先做个总结，然后再进行具体的分析：CSS不会阻塞DOM的解析，但是会影响JAVAScript的运行，javaSscript会阻止DOM树的解析，最终css（CSSOM）会影响DOM树的渲染，也可以说最终会影响渲染树的生成。接下来我们先看javascript对DOM树构建和渲染是如何造成影响的，分成三种类型来讲解： Ja...
- z-index属性规定元素的堆叠顺序，值越高就会显示在上面。无定位 <style> .div0{ height: 80px; width:100px; } div{ height: 50px; width:60px; } ... z-index属性规定元素的堆叠顺序，值越高就会显示在上面。无定位 <style> .div0{ height: 80px; width:100px; } div{ height: 50px; width:60px; } ...
- 通过transform2D转换我么可以做一些简单的动画效果 以及让页面更规整移动：translate旋转：rotate缩放：scale本篇文章将会讲解上面这三个属性，文章包含个人理解（错误请指出）位移 translate移动元素位置的方法，再2D平面中进行移动，有两个值，第一个值是x轴移动，第二个值是y轴移动，正数向右向下移动，负数向左向上移动。transform: translate(x... 通过transform2D转换我么可以做一些简单的动画效果 以及让页面更规整移动：translate旋转：rotate缩放：scale本篇文章将会讲解上面这三个属性，文章包含个人理解（错误请指出）位移 translate移动元素位置的方法，再2D平面中进行移动，有两个值，第一个值是x轴移动，第二个值是y轴移动，正数向右向下移动，负数向左向上移动。transform: translate(x...
- CSS3动画属性 animation 文章包含个人理解错误请指出keyframes用 keyframes定义动画，写上动画要执行的内容， （类似类选择器） @keyframes a { 0% { width: 300px; } 100% { width: 600p... CSS3动画属性 animation 文章包含个人理解错误请指出keyframes用 keyframes定义动画，写上动画要执行的内容， （类似类选择器） @keyframes a { 0% { width: 300px; } 100% { width: 600p...
上滑加载中
推荐直播
-
HDC深度解读系列 - Serverless与MCP融合创新，构建AI应用全新智能中枢2025/08/20 周三 16:30-18:00
张昆鹏 HCDG北京核心组代表
HDC2025期间，华为云展示了Serverless与MCP融合创新的解决方案，本期访谈直播，由华为云开发者专家(HCDE)兼华为云开发者社区组织HCDG北京核心组代表张鹏先生主持，华为云PaaS服务产品部 Serverless总监Ewen为大家深度解读华为云Serverless与MCP如何融合构建AI应用全新智能中枢
去报名
热门标签