一、CSS样式规则

1、基本结构

<html>

  <head>

    <style>

      h1{

        color: orange;

       }

    </style>

  </head>

  <body>

  </body>

</html>

二、font字体

1、字号与字体

font-size: 字号大小

font-family: 字体 font-family: "宋体";

使用技巧:

网页中普遍使用14px 字号;

尽量使用偶数的字号;

使用多个字体,字体间用“,”逗号隔开,中文字体需加引号,英文字体可以不加,

英文字体放在中文字体之前,字体有空格要加引号;

尽量使用默认字体;

2、unicode字体

对于不支持中文字体

方案一、可以用使用英文来替代,如font-family: "Microsoft Yahei";

方案二、在css直接使用unicode 编码来写字体名称可以避免这些错误,使用unicode写

中文字体,浏览器可以正确解析 如: font-family:"\5FAE\8F6F\96C5\9ED1"; 表示设置字体为“微软雅黑”

注:尽量写宋体、微软雅黑

3、Css注释

/*注释内容*/

4、字体加粗

font-weight: 字体粗细

font-weight: bold;字体加粗 700=blod nomal=400 尽量使用数字

5、字体倾斜

font-style: 字体风格

默认值: normal 正常 italic 倾斜

注:平时我们很少让字体倾斜,反而让倾斜的字体变成普通模式

6、font综合设置字体样式(重点)

选择器{font: font-style font-weight font-size/line-height font-family}

如:font{italic bold 14px "微软雅黑"}/*font 综合写法 更简洁*/

注:必须按照这个顺序写,必须保留font-size,font-family属性否则不起作用

第十一课 CSS介绍与font字体 css学习1的更多相关文章

  1. CSS基础 和 font字体、背景属性连写 与 清除浮动方法

    1.伪类 1. :link 2. :visited 3. :hover(重要) 4. :active 5. :focus(input标签获取光标焦点) 2.伪元素 1.:first-letter 2. ...

  2. CSS font字体知识学习

    字体系列 [1]5种通用字体系列:拥有相似外观的字体系列 serif字体:字体成比例,且有上下短线(衬线字体),包括Times\Georgia\New century Schoolbook sans- ...

  3. css常用样式font控制字体的多种变换

    CSS 字体属性定义文本的字体系列.大小.加粗.风格(如斜体)和变形(如小型大写字母)font-family控制字体,由于各个电脑系统安装的字体不尽相同,但是基本装有黑体.宋体与微软雅黑这三款字体,通 ...

  4. 前端 CSS 介绍

    CSS介绍 我们为什么需要CSS? 使用css的目的就是让网页具有美观一致的页面,另外一个最重要的原因是内容与格式分离 在没有CSS之前,我们想要修改HTML标签的样式需要为每个HTML标签单独定义样 ...

  5. 1.css介绍

    CSS介绍 我们为什么需要CSS? 使用css的目的就是让网页具有美观一致的页面,另外一个最重要的原因是内容与格式分离 在没有CSS之前,我们想要修改HTML元素的样式需要为每个HTML元素单独定义样 ...

  6. CSS颜色及文本字体

    CSS颜色及文本字体 CSS颜色表示法 CSS文本设置 CSS边框属性 背景属性 元素溢出 CSS颜色及文本字体 CSS颜色表示法 颜色名表示,比如:red 红色,yellow黄色,pick粉色 16 ...

  7. NeHe OpenGL教程 第二十一课:线的游戏

    转自[翻译]NeHe OpenGL 教程 前言 声明,此 NeHe OpenGL教程系列文章由51博客yarin翻译(2010-08-19),本博客为转载并稍加整理与修改.对NeHe的OpenGL管线 ...

  8. css基础之 font的简写规则 以及 自定义 CSS3 @font-face详细用法

    Part 1 font简写 CSS的命名规则是用英文字母 数字 和下划线(一般用小写)来命名.简写css font的好处有三:一是写起来方便(就像键盘快捷键):二是简化代码:三是帮助你熟悉和深刻理解c ...

  9. 2018年最完整5大网页设计图标解决方案:Font Awesome奥森图Unicode、CSS 和、Font以及国产zfont图标集

    网上有很多高质量的图标,基于icon的关键词能在Google上搜索到不少内容,不考虑版权外还要修改大小.颜色等等,现在介绍一些替代方案:Unicode.CSS 和 Font,它具有更高的灵活性. 方案 ...

随机推荐

  1. 深入理解pandas读取excel,txt,csv文件等命令

    pandas读取文件官方提供的文档 在使用pandas读取文件之前,必备的内容,必然属于官方文档,官方文档查阅地址 http://pandas.pydata.org/pandas-docs/versi ...

  2. SpringCloud-分布式链路跟踪配置详解

    SpringCloud-分布式链路跟踪 作者 : Stanley 罗昊 [转载请注明出处和署名,谢谢!] 注:作者使用IDEA + Gradle 注:需要有一定的java SpringBoot and ...

  3. 30分钟玩转Net MVC 基于WebUploader的大文件分片上传、断网续传、秒传(文末附带demo下载)

    现在的项目开发基本上都用到了上传文件功能,或图片,或文档,或视频.我们常用的常规上传已经能够满足当前要求了, 然而有时会出现如下问题: 文件过大(比如1G以上),超出服务端的请求大小限制: 请求时间过 ...

  4. 面试官,你再问我 Bit Operation 试试?

    在面试环节中,面试官很喜欢问一些特别的题目,这些题目有着特殊的解法,如果回答的巧妙往往能在面试中加分. 在这些题目中,位操作(Bit Operation)就是极具魅力的一种.今天,吴师兄就来分享 Le ...

  5. Restframe_work 回顾记忆集

    目录 Restframe_work 回顾记忆集 rest_framework主要功能介绍 rest_framework主要模块介绍 记忆集 错题集 混淆集 重点集 难点集 Restframe_work ...

  6. ORM(三)QuerySet查询字段操作

    这里的环境还是用上次的环境: Django项目:orm_practice app/models.py中有如下几个类: models.py publishing表内容如下: pid name 1 机械工 ...

  7. 一份.NET 容器化的调查小结

    小编在上个月在微信公众号"dotnet跨平台" 做了一个针对.NET 容器化的调查:https://mp.weixin.qq.com/s/oszbuIORT0G8XLLgMZzkn ...

  8. 有趣的 box-decoration-break

    这两天接触到一个很有意思的 CSS 属性 -- box-decoration-break.下面就一起去一探究竟. 因为 MDN 上关于这个属性,没有中文文档,所以一直在想一个合理贴切的中文翻译.直译一 ...

  9. java.lang.ClassNotFoundException: org.I0Itec.zkclient.IZkStateListener异常解决

    在启动Dubbo项目时,出现该异常 java.lang.ClassNotFoundException: org.I0Itec.zkclient.IZkStateListener 解决,引入 <d ...

  10. MySQL学习(四)Join 等开发常用的操作 --- 2019年2月

    1.查数据太多不会把内存用光 InnoDB 的数据是保存在主键索引上,然后索引树分割保存在数据页上,数据页存在内存中/磁盘.change buffer 就是先把修改操作记录,然后读数据的时候,内存没有 ...