首页 > 其他分享 >CSS样式

CSS样式

时间:2024-09-12 10:24:51浏览次数:11  
标签:定位 伪类 样式 字体 文本 选择器 CSS 属性

下列笔记均是来自尚硅谷张天禹的上课内容。

1 样式写的位置

1.1 行内(不推荐)

 1.2 内部

1.3 外部 

1.4 优先级 

2 css语法规范

3 选择器

3.1  通配选择器

常用于清除q样式

3.2元素选择器 

3.3 类选择器 

 3.4 id选择器

3.5 总结

 3.6 交集选择器

3.7 并集选择器

3.8 后代选择器

 3.9 子代选择器

3.10 兄弟选择器 

 3.11 属性选择

 3.12 伪类选择器

3.13 结构伪类 

3.14否定伪类 

3.15UI伪类

3.16 目标伪类 

3.17语言伪类 

3.18伪元素选择器

 4 选择器优先级

4 CCS三大特性

 5 颜色表示

 

6 字体属性 

6.1字体大小

6.2字体族

6.3字体风格

6.4字体粗细

6.5字体复合属性

7 文本属性

7.1文本颜色 

7.2文本间距

7.3文本修饰 (去掉a标签下划线)

 7.4 文本缩进

 7.5 文本对齐

 

8列表相关属性

 8.1边框相关属性

8.2表格独有属性 

9 背景相关属性 

10 鼠标相关属性

11 长度单位

12 元素显示模式

 

 12.1 修改显示模式

13盒子模型组成

13.1 盒子内边距 

 13.2 盒子边框

13.3 盒子外边距

13.4 margin塌陷问题

13.5 margin合并问题

13.6 内容溢出

 13.7 元素隐藏

13.8 布局小技巧

 13.9行内块的幽灵问题

14 浮动

15  定位

15.1 相对定位

15.2绝对定位

15.3固定定位 

15.4 粘性定位

16 布局常用类名

标签:定位,伪类,样式,字体,文本,选择器,CSS,属性
From: https://blog.csdn.net/m0_75165868/article/details/142103418

相关文章

  • html+css网页设计 旅游 雪花旅行社5个页面
    html+css网页设计旅游雪花旅行社5个页面网页作品代码简单,可使用任意HTML辑软件(如:Dreamweaver、HBuilder、Vscode、Sublime、Webstorm、Text、Notepad++等任意html编辑软件进行运行及修改编辑等操作)。获取源码1,访问该网站https://download.csdn.net/download/qq_42......
  • 【CSS in Depth 2 精译_028】第五章 网格布局 + 5.1 构建基础网格
    当前内容所在位置(可进入专栏查看其他译好的章节内容)第一章层叠、优先级与继承(已完结)1.1层叠1.2继承1.3特殊值1.4简写属性1.5CSS渐进式增强技术1.6本章小结第二章相对单位(已完结)2.1相对单位的威力2.2em与rem2.3告别像素思维2.4视口的相对单位2.5......
  • 181 Animation Basics & CSS Transitions
    实现点击Animate,上面的方块移动示例步骤1、为Animate按钮添加@click方法animateBlock<button@click="animateBlock">Animate</button>2、添加animatedBlock变量控制是否可以移动data() {    return {      animatedBlock: false,      dialogIsV......
  • css常用方式
     常容器用的样式:position:relative|absolute;/*相对定位|决定定位*/display:flex;/*浮动*/line-height:0px;/*div撑开问题*/对 rpx 详细说明:设计师在提供设计图时,一般只提供一个分辨率的图。严格按设计图标注的px做开发,在不同宽度的手机上界面很容易变......
  • HTML静态网页作业(HTML+CSS+JS)——蜡笔小新动漫网页设计制作(5个页面)
    ......
  • HTML/CSS/JS学习笔记 Day4(HTML--C3 表格)
    跟着该视频学习,记录笔记:【黑马程序员pink老师前端入门教程,零基础必看的h5(html5)+css3+移动端前端视频教程】https://www.bilibili.com/video/BV14J4114768?p=12&vd_source=04ee94ad3f2168d7d5252c857a2bf358Day4 内容梳理:目录HTML3.0表格3.1表格标签(1)语法基本标签......
  • tailwindcss学习:2 自定义类的使用和常见的tailwindcss前缀
    1.自定义类的定义在Tailwind CSS中,您可以通过 tailwind.config.js 文件定义自定义类。类似 border-custom-green 这种写法实际上是一个组合类,通常是由自定义类和内置类结合而成的。示例:自定义边框颜色假设您在 tailwind.config.js 中定义了一个自定义颜色://tailwi......
  • JavaWeb开发01 - HTML+CSS
    浏览器内核对前端代码进行渲染解析,为确保解析效果一直制定web标准。Web标准也称为网页标准,由一系列的标准组成,大部分由W3C(WorldWideWebConsortium,万维网联盟)负责制定。由三个组成部分:HTML:负责网页的结构(页面元素和内容)。CSS:负责网页的表现(页面元素的外观、位置等页面样式......
  • 34-样式迁移
    类似于加了一层滤镜基于CNN的样式迁移:如下对于合成图片X,我们希望它的内容和输入的内容图片,放入同一个CNN,在某一个卷积层上,输出的与内容有关的特征能够匹配同时,,对于样式图片,我们希望合成图片X,和样式图片放入同一个CNN,在某一个卷积层上,输出的与样式有关的特征能够匹配。如果我......
  • css进阶语法
    css进阶语法选择器:在大括号之前写的内容,就是选择器,找到你要选择的内容标签选择器:用标签的名字来进行页面元素、标签、标记的选择id选择器:用html标签中的id属性来进行选取的方式例子#p1{color:aqua;}#p2{color:red;}#p3{color:aquamarine;}<body> <pid="p1">周杰伦</p......