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.行内式 ...
随机推荐
- Android数据存储原理分析
Android上常见的数据存储方式为: SharedPreferences是 Android 中比较常用的存储方法,本篇将从源码角度带大家分析一下Android中常用的轻量级数据存储工具SharedP ...
- android AlertDialog控件使用
1.先创建activity_alert_dialog.xml <?xml version="1.0" encoding="utf-8"?> < ...
- Android 低功耗蓝牙BLE 开发注意事项
基本概念和问题 1.蓝牙设计范式? 当手机通过扫描低功耗蓝牙设备并连接上后,手机与蓝牙设备构成了客户端-服务端架构.手机通过连接蓝牙设备,可以读取蓝牙设备上的信息.手机就是客户端,蓝牙设备是服务端. ...
- iOS配置TARGETS
说一下背景 自从这个项目不死不活的迭代了2年,从项目搭建到现在,一直都是自己在开发和维护,所以项目结构非常清晰,但是之前的水平写的代码现在看来也是惨不忍睹,不过本人比较懒,也就没有考虑过重构的事情 - ...
- ANE打包工具使用视频教程 -- 梦宇技术 @极客学院
来源:http://xtiqin.blog.163.com/blog/static/17017217920133584934827/ ANE打包工具使用视频教程 2013-04-05 08:49:34 ...
- The server quit without updating PID file
[root@fjgh ~]# service mysqld start Starting MySQL... ERROR! The server quit without updating PID fi ...
- 如何让django模型中的字段和model名显示为中文
如何让django模型中的字段和model名显示为中文:在模型中加入class Meta即可 class People(models.Model): name = models.CharField(n ...
- 隐藏Apache版本号及版本敏感信息
在安装软件前,我们需要隐藏软件的版本号及版本其他信息,这样就大大提高了安全指数. 只隐藏版本号: 我们在主配置文件里:httpd.conf [root@bqh- ~]# curl -i bbs.bqh ...
- LGOJP1941 飞扬的小鸟
题目链接 题目链接 题解 \(f[i][j]\)表示位置\((i,j)\)到达需要的最小点击数. \(f[i][j]=\min\{{f[i-1][j-kx]+k},f[i-1][j+y]\}\) \( ...
- java.lang.NoClassDefFoundError: org/apache/zookeeper/proto/SetWatches
Session 0x16b21fa441900b6 for server 192.168.240.126/192.168.240.126:2181, unexpected error, closing ...