代码编织梦想

灯塔:css笔记(2)-爱代码爱编程

一 选择器进阶 后代选择器:空格 作用:根据HTML标签的嵌套关系,,选择父元素 后代中满足条件的元素 选择器语法:选择器1 选择器2{ css } 结果: *在选择器1所找到标签的后代(儿子 孙子 重孙子...)中,找到满足选择器2的标签,设置样式 注意点: 1.后代包括:儿子 孙子 重孙子.... 2.后代选择器中,选择器与选择器之间通

灯塔:css笔记(1)-爱代码爱编程

CSS:层叠样式表 所谓层叠 即叠加的意思,表示样式可以一层一层的层叠覆盖 css写在style标签中,style标签一般写在head标签里面,title标签下面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

灯塔:css笔记(3)-爱代码爱编程

盒子模型: 盒子的概念 1.页面中的每一个标签都可以看做是一个“盒子”,通过盒子的视角更方便的进行布局 2.浏览器在渲染(显示)网页时,会将网页中的元素看作是一个个矩形区域,我们也形象的称之为盒子 盒子模型: CSS中规定每个盒子分别由:内容区域(content)、内边距区域(padding)、边框区域(border)、外边距区域(margin)

css-爱代码爱编程

CSS-DAY2 2024/2/4 Emmet语法 快速生成HTML结构语法 如果想要生成多个相同标签 加上 * 就可以了 比如 div*3 就可以快速生成3个div如果有父子级关系的标签,可以用 > 比如 u

灯塔:css笔记(4)-爱代码爱编程

伪类选择器: 1.作用与优势:         1.作用:根据元素在HTML中的结构关系查找元素         2.优势:减少对于HTML中类的依赖,有利于保持代码的整洁         3.场景:常用于查找某父级选择器中的子元素 2.选择器 选择器说明E:first-child{ }匹配父元素中第一个子元素,并且是E元素E:last-chi

html5+css3+移动web——css 文字控制属性-爱代码爱编程

系列文章目录 HTML5+CSS3+移动web——HTML 基础-CSDN博客https://blog.csdn.net/ymxk2876721452/article/details/136070953?spm=1001.2014.3001.5502HTML5+CSS3+移动web——列表、表格、表单-CSDN博客https://blog.csdn.ne

前端之css 创建css-爱代码爱编程

创建css有三种创建样式,行内引入、内联引入、外联引入。 行内引入 在行内标签引入 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>行内样式</title> </he

css:过渡动画 (transition)与关键帧动画(keyfram)-爱代码爱编程

一、过渡动画 (Transition) 1.简单介绍 Transition能为样式的变化提供过渡效果,例如在下面的代码中: .main { width: 300px; height: 100px; background-color: #d26f6f; } .main:hover {

css中如何设置单行或多行内容超出后,显示省略号-爱代码爱编程

1. 设置超出显示省略号 css设置超出显示省略号可分两种情况: 单行文本溢出显示省略号…多行文本溢出显示省略号… 但使用的核心代码是一样的:需要先使用 overflow:hidden;来把超出的部分隐藏,然后使用te

html+css网页制作成品—— html+css+javascript 绿色的随行旅游网页设计实例 企业网站制作-爱代码爱编程

👨‍🎓学生HTML静态网页基础水平制作👩‍🎓,页面排版干净简洁。使用HTML+CSS页面布局设计,web大学生网页设计作业源码,这是一个不错的旅游网页制作,画面精明,排版整洁,内容丰富,主题鲜明,非常适合初学者学习使用

html静态网页成品作业(html+css)——抗击疫情网页(4个页面)-爱代码爱编程

🎉不定期分享源码,关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 🏷️本套采用HTML+CSS,未使用Ja

html静态网页成品作业(html+css)——家乡广州介绍设计制作(5个页面)-爱代码爱编程

🎉不定期分享源码,关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 🏷️本套采用HTML+CSS,未使用Ja

html静态网页成品作业(html+css)——宠物狗店网页(1个页面)-爱代码爱编程

🎉不定期分享源码,关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 🏷️本套采用HTML+CSS,未使用Ja

【css练习】万年历 html+css+js-爱代码爱编程

效果图 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <me

打造精美响应式css日历:从基础到高级样式-爱代码爱编程

🌟 前言 欢迎来到我的技术小宇宙!🌌 这里不仅是我记录技术点滴的后花园,也是我分享学习心得和项目经验的乐园。📚 无论你是技术小白还是资深大牛,这里总有一些内容能触动你的好奇心。🔍 🤖 洛可可白:个人主页 🔥

css练习-爱代码爱编程

差不多还挺像 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <

css 2d转换 动画 3d转换-爱代码爱编程

 一、CSS 2D转换 转换(transform)是CSS3中具有颠覆性的特征之一,可以实现元素的位移(translate)、旋转(rotate)、缩放(scale)等效果 移动盒子的位置:定位、盒子的外边距、2d转换移动 1、2D转换之移动translate 1、我们tranlate里面的参数是可以用% 2、

css 样式记录-爱代码爱编程

    实现两栏布局如图所示样式:    方法1:    <div style="display: flex; justify-content: space-between; width:100%;">       <div>1</div>       <div>2</div>

web前端-爱代码爱编程

HTML 是页面的骨,CSS 就是页面的样式,就是皮,就是描述了任意一个网页的元素:大小、字体、颜色、背景、边框。 每一个 CSS 包含两个部分:选择器+应用的属性键值: 这里就是键值对结构,p 就是选择器,大括号里面就是键值对结构,每个键值对就对应一个 CSS 的属性。CSS 代码可以放到 HTML 当中(通常是放在 style 当中),然后 sty

【css】overflow中scroll和hidden的区别是什么?-爱代码爱编程

overflow: scroll; 和 overflow: hidden; 是CSS中用于处理元素内容溢出其容器时的两种不同属性值。它们的主要区别在于当内容超出指定容器的尺寸时,它们如何显示或隐藏内容。 如果你有一个