CSS(1)
使用CSS的注意点:
1.style标签必须写在head标签的开始标签和结束标签之间(也就是必须和title标签是兄弟关系)。
2.style标签中的type属性其实可以不用写,默认就是type="text/css"。
3.设置样式时必须按照固定的格式来设置,key :value;其中:不能省略,分号大多数情况下也不能省略。 
文字属性:
- 规定文字样式的属性
格式:font-style:italic; 取值:normal--正常的,默认是正常的 italic--倾斜的
快捷键:fs font-style:italic; fsn font-style: normal; - 规定文字粗细的属性
格式:font-weight:bold;
单词取值:bold 加粗 、bolder 比加粗还要粗 、lighter 细线,默认就是细线
快捷键:fwb font-weight:bold;
数字取值:100-900整百的数字,700对应的是bold的级别
3.规定文字字体的属性
格式:font-size:30px;
单位:px(像素 pixel)
注意点:通过font-size设置大小时,必须带上px单位
快捷键:fs30 font-size:30px; - 规定文字字体的属性
格式:font-family:"楷体";
注意点:
1)如果取值是中文,需要用双引号或者单引号括起来
2)设置的字体必须是用户电脑里面已经安装的字体(如果设置的字体不存在,则会使用默认的字体来显示)
3)如果想给中文和英文分别单独设置字体,该怎么办?
但凡是中文字体,里面都包含了英文,但凡是英文字体,里面都没有包含中文。也就是说中文字体可以处理英文,而英文字体不能处理中文。如果想给界面中的英文单独设置字体,那么英文的字体必须写在中文的前面。
快捷键:ff font-family:;
5.文字属性的简写
格式:font:style weight size family
注意点:
1)在这种缩写格式中有点属性值可以省略,style、weight可以省略。
2)在这种缩写格式中style和weight的位置可以交换。
3)在这种缩写格式中有点属性是不可以省略的,size、family是不可以省略的。
4)size和family的位置是不能随便乱放的,size一定要在family的前面,而且size和family必须写在所有属性的最后。
文本属性
- 文本装饰的属性
格式:text-decoration:underline;取值:underline 下划线、 line-through 删除线、overline 上划线、去掉超链接的下划线 - 文本水平对齐的属性
格式:text-align:left;取值:left 左、right 右、center 中 - 文本缩进的属性
格式:text-indent:2em;取值:2em,其中em是单位,一个em代表缩进一个文字的宽度
颜色属性
- 文本装饰的属性
格式:color:值;
取值:1)英文单词:常见的颜色都有对应的英文单词,但是不是所有颜色都能用英文单词来表达,是有限制的。
2)rgb,其实就是三原色,r(red)、g(green)、b(blue),格式:rgb(0,0,0)
常见颜色:红色:rgb(255,0,0) 绿色:rgb(0,255,0) 蓝色:rgb(0,0,255) 黑色:rgb(0,0,0) 白色:rgb(255,255,255)
注意:在前端开发中其实不常用黑色,只要让红色、绿色、蓝色的值都一样就是灰色,而且如果这三个值越小那么就越偏黑色,越大就越偏白色。
3)rgba,与rgb差不多一样,多出来的a代表透明度,取值是0到1,取值越小就越透明
4)十六进制,其实本质就是RGB十六进制中是通过每两位表示一个颜色,例如:#FFEE00 FF表示R EE表示G 00表示B

<wiz_tmp_tag id="wiz-table-range-border" contenteditable="false" style="display: none;">
CSS(1)的更多相关文章
- 前端学习 第五弹: CSS (一)
前端学习 第五弹: CSS (一) 创建css: <link rel="stylesheet" type="text/css" href="my ...
- CSS——(2)与标准流盒模型
部分博客<CSS--(1)基础>中简介了CSS的概念和几种用法,如今主要是介绍其的核心内容. 盒子模型 为了理解盒子模型,我们能够先从生活中的盒子入手.盒子是用来放置物品的,内部除了有物品 ...
- 前端总结·基础篇·CSS(一)布局
目录 这是<前端总结·基础篇·CSS>系列的第一篇,主要总结一下布局的基础知识. 一.显示(display) 1.1 盒模型(box-model) 1.2 行内元素(inline) &am ...
- 前端总结·基础篇·CSS(二)视觉
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 前端总结·基础篇·CSS(四)兼容 目录 一.动画(animation)(IE ...
- 前端总结·基础篇·CSS(三)补充
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 目录 一.移动端 1.1 视口(viewport) 1.2 媒体查询(medi ...
- CSS(一) 引入方式 选择器 权重
Css(一) Cascading Style Sheet 层叠样式表 css注释方式/* */ 一.Css引入方式 1. 行间样式 style=" key:value; " &l ...
- CSS(选择器)
CSS(选择器) 作用:用于匹配 HTML 元素 选择器分类: 1.元素选择器 a{} 2.伪元素选择器 ::before{} (真实存在的元素) 3.类选择器 .link{} 4.属性选择 ...
- CSS——(2)盒子模型与标准流
上篇博客<CSS--(1)基础>中简单介绍了CSS的概念和几种使用方法,现在主要是介绍其的核心内容. 盒子模型 为了理解盒子模型,我们可以先从生活中的盒子入手.盒子是用来放置物品的,内部除 ...
- ASP.NET动态网站制作(3)--css(2)
前言:css分为四次课讲完,第一节课内容见ASP.NET动态网站制作(2)--css(1),接下来的内容会涉及到定位.浮动.盒子模型(第二次课).css的具体应用(第三次课).css3(第四次课).今 ...
- css(一)
CSS CSS是Cascading Style Sheets的简称,中文称为层叠样式表,用来控制网页数据的表现,可以使网页的表现与数据内容分离. 一 css的四种引入方式 1.行内式 ...
随机推荐
- linux下安装grpc插件 (c++和go语言)
在debian/ubuntu系统下,需要做如下准备操作: $ [sudo] apt-get install build-essential autoconf libtool pkg-config 如果 ...
- 数据库事务和锁(三)——INNODB_LOCKS, INNODB_LOCK_WAITS, INNODB_TRX表的简单介绍
INNODB_LOCKS, INNODB_LOCK_WAITS, INNODB_TRX是MYSQL中事务和锁相关的表.通常我们遇到事务超时或锁相关问题时,直接运行下面SQL语句即可进行简单检查: -- ...
- FastJSON JSONObject 字段排序 Feature.OrderedField
package cn.tongdun.robot.web; import com.alibaba.fastjson.JSON; import com.alibaba.fastjson.TypeRefe ...
- 2019牛客多校第一场 A.Equivalent Prefixes
题目描述 Two arrays u and v each with m distinct elements are called equivalent if and only if RMQ(u,l,r ...
- P1345 [USACO5.4]奶牛的电信[拆点+最小割]
题目描述 农夫约翰的奶牛们喜欢通过电邮保持联系,于是她们建立了一个奶牛电脑网络,以便互相交流.这些机器用如下的方式发送电邮:如果存在一个由c台电脑组成的序列a1,a2,...,a(c),且a1与a2相 ...
- elementUI 控制 DatePicker组件 不能选择 设定的日期
<el-date-picker v-model="date" type="daterange" range-separator="至" ...
- myeclipse常用快捷键和小技巧
常用快捷键: Ctrl + Shift + R 在整个项目中查找文件 Ctrl + H 查找文件,可以限定文件中包含的内容 Ctrl + Shift + G 查找一个方法在哪里被调用 Ctrl + O ...
- oracle 查询月份
①:select substr(to_char(sysdate,'yyyy-mm-dd'),6,2) from dual; ②:select to_char(sysdate,'MM') from du ...
- “只有DBA才能导入由其他DBA导出的文件”各种解决办法
“只有DBA才能导入由其他DBA导出的文件”各种解决办法 当oracle导入的时候出现“只有 DBA 才能导入由其他 DBA 导出的文件”的时候通常有以下几种解决办法! 1:常见的是直接grant ...
- Django自定义filter