首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

CSS第一天

,最后需要写分号 CSS常见属性: CSS常见属性 作用 color 文字颜色 font-size: 文字大小 background-color 背景颜色 width 宽度 height 高度 ---...- CSS引入方式: 引入方式 书写位置 作用范围 使用场景 内嵌式 CSS 写在style标签中 当前页面 小案例 外联式 CSS 写在一个单独的.css文件中 多个页面 项目中 行内式 CSS 写在标签的...style属性中 当前标签 配合js使用 ---- 标签选择器: 通过标签名,找到页面中所有这类标签,设置样式 div { color: red; } 标签选择器选择的是一类标签,而不是单独某一个...margin和padding ---- 字体和文本样式: 1️⃣字体大小:font-size(数字 + px) 谷歌浏览器默认文字大小是16px,单位需要设置,否则无效 2️⃣字体粗细:font-weight...正常:normal(400) 加粗:bold(700) 不是所有字体都提供了九种粗细,因此部分取值页面中无变化 实际开发中以:正常、加粗两种取值使用最多4️⃣ 3️⃣字体样式(是否倾斜):font-style

83110
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    『知识巩固#1』Html、Css基础整理

    html中空格合并的现象 &nsbp 空格 © 网页的版权 copyright Css 基础认知 css的引入方式 内嵌式 css写入style标签中,通常约定为html文件中的...head标签内 外联式 写入单独的.css文件中 通过link引入link中 行内式 css 写在标签的style属性中 基础选择器 标签选择器 标签名 {css属性名: 属性值;} 类选择器...如果同时设置了行高和font连写,注意覆盖问题 font: style weight size/line-height family 颜色常见取值 网页设计时直接取色器吸就好啦qvq 关键词 rgb...important 如果不是继承,则权重最高 排错 使用谷歌F12找错误 开发者常用 常用单词拼写错误 我自己就经常犯 main函数都能搞成mian 上一行出错的代码可能会导致下一行代码失效 盒子模型...官方的联想模型为 苹果电脑的包装盒,个人理解为箱装盒式牛奶 边框 简写为 bd后按tab键 border: 粗细 线条样式 颜色 不分先后顺序 MDN官网上线条的样式如下 可拆分单个属性 border-width

    4K20

    css基础第一弹

    CSS 是也是一种标记语言。 有什么用:主要用于设置HTML页面中的文本内容(字体、大小、对齐方式等)、图片的外形(宽高、边框样式、边距等)以及版面的布局和外观显示样式。...选择器是用于指定CSS样式的HTML标签,花括号内是对该对象设置的具体样式 属性和属性值以键值对的形式出现 属性是对指定的对象设置的样式属性,例如字体大小、文本颜色等 属性和属性值之间用英文:分开 多个...选择器的分类 css选择器分为基础选择器和复合选择器两个大类,这里是基础选择器 基础选择器是由单个选择器组成的。...一般情况下,如果用空格隔开的多个单词组成的字体,加引号 字体大小 CSS 使用font-size属性定义字体大小 p { font-size: 20px; } px(像素)是网页中常用的单位 不同浏览器的默认字体大小是不一样的...其中字号和字体必须同时出现 文本属性 CSS Text(文本)属性可定义文本的外观,比如文本的颜色、对齐文本、装饰文本、文本缩进、行间距等。

    1.9K20

    css基础第一弹

    CSS 是也是一种标记语言。 有什么用:主要用于设置HTML页面中的文本内容(字体、大小、对齐方式等)、图片的外形(宽高、边框样式、边距等)以及版面的布局和外观显示样式。...选择器是用于指定CSS样式的HTML标签,花括号内是对该对象设置的具体样式 属性和属性值以键值对的形式出现 属性是对指定的对象设置的样式属性,例如字体大小、文本颜色等 属性和属性值之间用英文:分开 多个...选择器的分类 css选择器分为基础选择器和复合选择器两个大类,这里是基础选择器 基础选择器是由单个选择器组成的。...一般情况下,如果用空格隔开的多个单词组成的字体,加引号 字体大小 CSS 使用font-size属性定义字体大小 css 代码: p { font-size: 20px; } px(像素)是网页中常用的单位...其中字号和字体必须同时出现 文本属性 CSS Text(文本)属性可定义文本的外观,比如文本的颜色、对齐文本、装饰文本、文本缩进、行间距等。

    10810

    【CSS3】css开篇基础(1)

    中,使用单引号和双引号的效果基本相同 css和html不分大小写,JavaScript 区分大小写。...所以通常我们对它进行使用的很少 4.CSS 字体属性 CSS Fonts(字体)属性用于定义字体系列、大小、粗细、和文字样式(如斜体)。...1.各种字体之间必须使用英文状态下的逗号隔开 2.一般情况下,如果有空格隔开的多个单词组成的字体,加引号“ ”. 3.尽量使用系统默认自带字体,保证在任何用户的浏览器中都能正确显示 4.最常见的几个字体...(同样这在文本字体的粗细中同样适用) font-weight CSS 使用 font-weight属性设置文本字体的粗细, 常用值: normal: 默认字体粗细 bold: 粗体 数值 (100 -...优点: 样式与 HTML 内容分离,便于维护和复用。 适合多页面网站,多个页面可以共享同一个样式文件。 能减少 HTML 文件的体积,页面加载时会缓存 CSS 文件,提高性能。

    10510

    IT课程 CSS基础 022_文本、字体、链接

    示例: p { text-indent: 2em; } 效果: 书写模式 CSS 中的书写模式是指文本的排列方向,包括水平、垂直和混合模式。...base example4">看看我的文本内容有没有溢出 效果: 字体 何如控制和定义字体是网页设计中重要的一部分。...字体单位选择: 使用相对单位(em、rem、%)可以更好地适应用户浏览器中设置的字体大小偏好,增加网站的可访问性。 行高设置: 根据字体大小适当设置行高,以提高文本的可读性。...通常,行高可以设置为字体大小的 1.4 到 1.6 倍。 粗细 CSS 中字体粗细可以使用 font-weight 属性来设置。 normal: 默认字体粗细。 bold: 加粗字体。...: transparent;">字体颜色 效果: 连接 在 CSS 中,可以使用 color 属性为链接(超链接)设置字体颜色。

    11510

    CSS语法小记

    mm 毫米 pt 点(point) 三、CSS颜色 颜色单位 说明 十六进制 如:color:#ffffff; 颜色名称 如:color:Red; 三原色单位 如:rgb(255,0,0...四、CSS控制字体 功能 语法 设置字号 font-size:12px; 设置字体 font-family:Arial,'宋体'; 设置字色 color:#fff; 设置行高 line-height...:50px; 设置字体粗细 font-weight:normal(正常) bolder(粗体) 设置字体样式 font-style:normal[正常]、italic[斜体]; 修饰文字 text-decoration...]、nowrap[强制在同一行显示] 大小写控制 text-transform:none[正常大小]、capitalize[首字母转大写]、uppercase[转换成大写]、lowercase[转换成小写...2.想要文字在在垂直方向上居中:将行高设置为元素高度(行高=元素高度)(前提:文字的内容不能超过元素的宽度,也就是不能换行)。

    51110

    HTMLCSS 第三章

    学习目标 css的作用和基本语法 css控制字体 基本选择器 伪类选择器 行高和对齐方式 css其他属性 首行缩进、字体下划线等 css的概念及其作用 css全称为(Cascading Style Sheets...3: 值3; } 注意:符号必须是英文状态下的 字体属性 设置字体的大小 font-size 设置字体的大小 取值:font-size: 12px; 注意:在css大多数数值都需要添加单位 设置字体的粗细...font-weight 设置字体的粗细 取值:normal 、bold、 100 - 900 多说一嘴:用数字设置的时候,只有400和700会产生变化,是因为字体在初始设计的时候就没有设置太多的粗细标准...,但是id选择器只能被一个元素调用 在同一个页面中吗,不能出现两个id值相同的元素 通配符选择器 * { 属性1: 值1; 属性2:值2; } 特点:选中任何元素,后期用于页面初始化。...其他细节属性 颜色属性 颜色属性的取值可以是 十六进制,rgb(), rgba() css的注释 /* 注释内容 */

    1.2K30

    【Web前端】借助文本样式为网页赋予生命

    文本样式不仅仅是装饰,它对用户体验和网站的可读性有着重要影响。 一、基本文本和字体样式 1. 字体 CSS 中的字体属性定义了文本的外观,包括字体的类型、大小、粗细等。...字体样式和粗细 字体样式 ​​font-style​​​ 属性用于设置字体样式,例如斜体: em { font-style: italic; } 字体粗细 ​​font-weight​​ 属性设置字体的粗细...字母和单词间距 字母间距 ​​letter-spacing​​​ 属性设置字母之间的间距: h1 { letter-spacing: 1px; } 单词间距 ​​word-spacing​​​ 属性设置单词之间的间距...Font 简写 ​​font​​​ 属性是一个简写属性,可以同时设置字体样式、粗细、大小、行高和字体家族。...使用 CSS 样式化这些元素,并确保它们在页面上美观且易于阅读。包括以下要求: 使用自定义字体和 Web 字体。 设置文本样式,包括字体、颜色、大小、行高、阴影等。

    5810

    CSS 基础 之 基础选择器+字体文本相关样式

    1.3 CSS 初体验 我们先来认识一下CSS 常见的属性: CSS 常见属性 作用 color 文字颜色 font-size 字体大小 background-color 背景颜色 width 宽度 height...2、CSS引入方式 内嵌式 CSS 写在style标签中 外联式 CSS 写在一个单独的.css文件中 行内式 CSS 写在标签的style属性中 2.1 内嵌式 style标签虽然可以写在页面任意位置...关键字: 正常——>normal 加粗 ——>bold 纯数字:100~900的整百数:正常——>400 加粗 ——>700 注意点 不是所有字体都提供了九种粗细,因此部分取值页面中无变化 实际开发中以...从左往右按照顺序查找,如果电脑中未安装该字体,则显示下一个字体 2. 如果都不支持,此时会根据操作系统,显示最后字体系列的默认字体 注意点: 1. 如果字体名称中存在多个单词,推荐使用引号包裹 2....如果字体名称中存在多个单词,推荐使用引号包裹 2. 最后一项字体系列不需要引号包裹 3.

    2.1K10

    【前端基础篇】CSS基础速通万字介绍(上篇)

    缺点:受到浏览器缓存影响, 修改之后 不一定 立刻生效 关于缓存: 这是计算机中一种常见的提升性能的技术手段. 网页依赖的资源(图片/CSS/JS等)通常是从服务器上获取的....:CSS 选择器参考手册 基础选择器 标签选择器 特点: 能快速为同一类型的标签都选择出来....CSS 中使用 # 开头表示 id 选择器 id 选择器的值和 html 中某个元素的 id 值相同 html 的元素 id 不必带 # id 是唯一的, 不能被多个标签使用 (是和类选择器最大的区别...元素1 元素2 {样式声明} 元素 1 和 元素 2 要使用空格分割 元素 1 是父级, 元素 2 是子级, 只选元素 2 , 不影响元素1 代码示例: 把 ol 中的 li 修改颜色, 不影响ol 的写法: 预定义的颜色值(直接是单词) [最常用] 十六进制形式 RGB 方式 十六进制形式表示颜色, 如果两两相同, 就可以用一个来表示.

    10610

    个人样式整理表

    , 31 1月 2021 作者 847954981@qq.com 说明补充 个人样式整理表 font-size 标签内字体大小 color 标签内字体颜色,可以用英文字母形式如blue,或者使用十六进制颜色表示...标签内字体的粗细,可以是具体是数字如:200;或者如normal(正常粗细),lighter(细),bold(粗),bolder(更粗) text-align 标签内文字对齐方式,center(中心对齐...),left(左对齐),right(右对齐) line-height 文字行高,可用于调节行间距,也可通过调节行高使得文字在图形内上下对齐 letter-spacing 字间距,英文的字间距是每个字母之间的间距...,而不是单词间间距,中文是每个汉字之间间距 font-family 字体,字体能否被应用取决于使用者电脑有没有安装这个字体如果值中用”,”连接了多种字体,则会依次加载,检验有没有安装这种字体,直到检验到安装的字体...-- 注释内容 --> CSS中注释方法(包括内部样式和外部样式)为: /* 注释内容 */

    41320

    HTML图像标记和CSS入门(二)

    3.CSS文本相关样式 3.1 font-size 字号大小 它的属性用于设置字号 相对长度 em px 最常用,推荐使用 3.2 font-family 字体 它的属性用于设置字体 p{font-size...:"微软雅黑”} 可以同时指定多个字体,中间用逗号隔开 各种字体之间必须使用英文的逗号隔开 3.3 font-weight :字体粗细 字体加粗除了用 b 和 strong 标签之外,可以使用CSS 来实现...font-weight属性用于定义字体的粗细,其可用属性值:normal、bold、bolder、lighter、100~900(100的整数倍)。...font-style:字体风格 字体倾斜除了用 i 和 em 标签之外,可以使用CSS 来实现,但是CSS 是没有语义的。...4.CSS文本外观属性 1.color 文本颜色 2.letter-spacing: 字体间距 属性为normal 或px em 允许负值 3…word-spacing:单词间距 中文字体无效

    1.5K10

    后盾人教程_最专业的后盾

    的标签 id属性不仅给css用,也给js用 标签元素使用多类样式声明:属性中的各个选择器用空格分开 四 结构选择器: h1 p:指定标签位置范围,h1标签里的后代p标签,空格代表每一层所有后代(...预处理器 less sass 带你玩转 CSS 3 文本,打牢前端开发基础 一 字体 font-family:用逗号分隔多个字体类型 @font-face:定义字体,引入自带字体 二 字重与字号...font-weight:字重,粗细 font-size:字号,相对值是父级字体 em:相对单位,父级元素的font-size 三 颜色与行高 color: line-height:一般是1.5em...:border-box,固定大小 元素边框:border-style:边线样式,border-width:粗细,border-color:颜色,border-top:联合设立上部 圆角控制:border-radius...,在渐变函数的颜色部分后边直接指定,控制渐变的范围 颜色渐变中间阈值:渐变过渡中间点,隔在颜色之间,控制渐变色占的比例 渐变重复:repeat-linear-gradient() 使用 CSS 3

    1K20

    3.字体样式-CSS基础

    一、字体样式 1.常用的字体样式属性 属性 说明 font-family 字体类型 font-size 字体大小 font-weight 字体粗细 font-style 字体风格 color 字体颜色...二、font-family(字体类型) 我们常说的宋体、楷体等就是字体类型。 在CSS中,使用font-family属性定义字体类型。...(2)属性值与双引号 若字体类型的属性值只有一个英文单词时,则不需要加上双引号;若是多个英文单词或中文,则需要加上双引号。...四、font-weight(字体粗细) 在CSS中,使用font-weight属性来定义字体粗细。 注意,字体粗细跟字体大小是完全不一样的,可千万不要弄混了,粗细指“肥瘦”,大小指“宽高”。...(4)实际开发 在实际开发中,font-style属性很少用到。 六、color(字体颜色) 在CSS中,可以使用color属性来定义字体颜色。

    3.1K10

    CSS基础知识巩固你的前端基础

    css用于网页的风格设计,包括字体,颜色,位置等。 css使用的4中方式:引入外部样式文件,导入外部样式文件,使用内部样式定义,使用内联样式定义。...定义文本的字体是否是斜体 font-weight 定义字体的粗细 font 可以一条样式定义各种字体属性 font-family用于设置元素的字体,该元素属性值一般可以设置多个字体。...font-weight用于设置字体的粗细, normal值等于400, bold的值等于700。...css文本属性表: 属性 说明 color 文本颜色 direction 文本方向或者书写方向 letter-spacing 字符的间距 line-height 文本的行高 text-align 文本的水平对齐方式属性...属性 说明 outline-style 定义轮廓的样式属性 outline-color 定义轮廓的颜色属性 outline-width 定义轮廓的宽度属性 outline 同一个声明中定义所有的轮廓属性

    2K10

    前端秘法基础式(CSS)(第二卷)

    body div{ font-family: 'Microsoft YaHei'; font-size: 30px; } 2.字体的颜色 有三种展示方式...2.1预定义的颜色值 直接用对应的单词 body div{ font-family: 'Microsoft YaHei'; font-size: 30px; color: red...; } 2.2十六进制 #ff0000表示红色,ff转成十进制就是255,一共有六位,每两位对应三原色中的一个,顺序是红绿蓝,每个颜色最多取到255,可以简写成#f00 2.3rgb表示法 color...: rgb(255, 0, 0); 3.字体粗细及样式 字体粗细有四种预定样式 normal默认值,粗细为400 bold粗700 bolder更粗 lighter更细 那么字体样式也有四种 normal...默认样式 italic斜体 oblique倾斜 inherit继承父元素的字体样式 4.文本 4.1text-align 控制文本靠左靠右居中 4.2text-indent 控制首行缩进,以em为单位代表缩进

    9510

    【JavaEE初阶】CSS

    外部样式:把css代码单独作为一个.css文件,再通过link属性,让html引入该css文件。但实际开发中,一般都是使用外部样式来写CSS。让html和css分开,互不影响。...ID选择器 html中页面中的每个元素都是可以设置一个全局唯一的id属性的, CSS中使用``#+id````名来表示id选择器, id选择器的值和html中某个元素的id值相同, id选择器只能针对唯一的元素生效.... font-weight, 表示字体粗细, 可以使用数字(1-1000)和常用英文单词设置, normal为正常粗细(与400等值),bold为加粗(与700等值), lighter要比从父元素继承来的值更细...值为italic表示设置倾斜, 值为normal表示取消倾斜. 2.文本属性 color, 表示字体颜色, 可以使用颜色的英文单词来表示, 但更常用的是使用rgb色光三原色(红,绿,蓝)来按比例调色...设置背景颜色, 与设置字体颜色一样, 可以使用英文单词, 也可以使用rgb/raba和十六进制表示,默认是transparent, 即透明的. background-image, 设置背景图片, 背景颜色和背景图片可以同时存在

    21210
    领券