一、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. centos7开放端口和防火墙设置

    centos7开放端口和防火墙设置. 查看防火墙状态: firewall-cmd --state 如果显示: not running 打开防火墙服务: systemctl start firewall ...

  2. Visio打开或取消箭头的自动吸附和自动连接

    在用Visio画图时Visio的自动对齐.自动连接.自动吸附功能确实能带了很多便利.但在画连接线时,Visio总是自动连接箭头与图形的固定节点,想要微调一下连接位置,就显得很不方便,需要关闭自动连接功 ...

  3. 用node探究http缓存

    用node搞web服务和直接用tomcat.Apache做服务器不太一样, 很多工作都需要自己做.缓存策略也要自己选择,虽然有像koa-static,express.static这些东西可以用来管理静 ...

  4. 【我们一起写框架】C#的AOP框架

    前言 AOP,大家都是听过的,它是一种面向切面的设计模式. 不过AOP虽然是被称为设计模式,但我们应该很少能看到AOP设计的框架.为什么呢? 因为,AOP单独设计的框架几乎是无法使用的.普遍的情况是, ...

  5. java_反射

    反射:reflect   成员属性:Field  成员方法:Method 构造方法:Constructor  类:Class 引用,援引:invoke   新实例:newInstance  Decla ...

  6. Git 分支模型

    翻译自:https://nvie.com/posts/a-successful-git-branching-model/ 在这篇文章中,主要介绍 Git 分支模型.不会谈论任何项目的细节,只讨论分支策 ...

  7. .NET Core 时代已经到了,你准备好了吗

    今天很多人都收到了阿里云函数计算支持.NET Core的短信了. 通过访问 https://help.aliyun.com/document_detail/112379.html 你可以看到最新的说明 ...

  8. Linux 桌面玩家指南:13. 使用 Git 及其和 Eclipse 的集成

    特别说明:要在我的随笔后写评论的小伙伴们请注意了,我的博客开启了 MathJax 数学公式支持,MathJax 使用$标记数学公式的开始和结束.如果某条评论中出现了两个$,MathJax 会将两个$之 ...

  9. JS定义函数的2种方式以及区别简述(为什么推荐第二种方式)

     无意中看到了阮一峰大神多年前的一篇博客: 12种不宜使用的Javascript语法    看到第9条的时候受到了启发,感觉之前没怎么理解清楚的一些问题好像突然就清晰了,如下图 可能光这样看,有些小伙 ...

  10. MyBridgeWebViewDemo【集成JsBridge开源库的的封装的webview】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 使用的是第三方库lzyzsd/JsBridge,但是不同的是,将自己封装的MyBridgeWebView通过继承BridgeWebV ...