CSS的字体样式

1. span标签(约定俗成：重要的东西用它括起来)

首选介绍一个约定俗成的东西：span标签。一般将想要突出的东西，比较重要的东西，用span标签括起来。

比如，”学习Java“这几个字，想突出Java，就用<span>和</span>标签把Java括起来，然后在用CSS的比如id标签选择器之类的操作它。

当然，不写成span也无所谓，但这是个约定俗成的东西，用span表示重要。

HTML代码：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="style.css">
</head>
<body>

学习<span id="重要">Java</span>

</body>
</html>

CSS代码：

/*
id选择器：# id名字{}
*/
#重要{
font-size: 50px;
}

效果：

2. 字体

1、字体

2、大小

3、粗细

4、颜色

5、也可以一行把上面全写上

HTML：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
​
<p class="p1">
    宋钢：“要是换成你，你会怎么办?”
    李光头：“要是换成我，我就宰了你!”
    宋钢：“我是你的兄弟啊?”
    李光头：“兄弟也一样宰了。”
</p>
​
<p class="p2">
    宋钢听了这话怔住了，过了一会儿他嘿嘿笑了起来，他仔细地看着李光头，
    看着这个相依为命的兄弟。
</p>
​
<p class="p3">
    这个兄弟刚才的那句话让宋钢突然获得了解放，他觉得自由了，
    他可以全心全意地投入到林红那里去了，而且势不可挡。
</p>
​
<p class="p4">
    宋钢笑出了声音，他由衷地对李光头说：“你这话说得真好。”
    李光头：“你要干什么?”
    宋钢：“我要去见林红，我要去告诉她，我喜欢她。”
</p>
​
<p class="p5">
    李光头：“宋钢，我们是兄弟……”
    宋钢幸福地回答：“兄弟也一样宰了。”
</p>
​
</body>
</html>

CSS：

/*
类选择器：. 类名字{}
 */
.p1 {
    font-family: 楷体;
}
​
.p2 {
    font-size: 30px;
}
​
.p3 {
    font-weight: bold;
}
​
.p4 {
    color: red;
}
​
.p5 {
    font: oblique bolder 16px "楷体";
}

效果：

CSS的字体样式的更多相关文章

  1. CSS之字体样式

    css字体样式 font-size:字号大小 font-size属性用于设置字号,该属性的值可以使用相对长度单位,也可以使用绝对长度单位.其中,相对长度单位比较常用,推荐使用像素单位px,绝对单位使用 ...

  2. css的字体样式怎么写

    为保证字体的正常加载 sans-serif不能丢 font-family:'MicrosoftYahei','微软雅黑',Arial,'宋体',sans-serif;

  3. css字体样式(Font Style),属性

    css字体样式(Font Style),属性   css字体样式(Font Style)是网页中不可或缺的样式属性之一,有了字体样式,我们的网页才能变得更加美观,因此字体样式属性也就成为了每一位设计者 ...

  4. 详解CSS设置默认字体样式

    浏览器默认的样式往往在不同的浏览器.不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏 ...

  5. css中的字体样式及元素样式

    css中的字体样式一般包含有就9中,常见的有7种.这7种依次为: 1.字体样式:font-family: 2.字体大小:font-size: 3.字体加粗:font-weight: 4.字体斜体:fo ...

  6. 详解CSS网页布局中默认字体样式

    浏览器默认的样式往往在不同的浏览器.不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏 ...

  7. 【CSS学习】--- 字体样式

    一.前言 CSS字体属性可以定义文本的字体系列.大小.加粗.颜色.风格(如斜体)和变形(如小型大写字母). CSS的字体属性: font-family 设置字体系列 font-size 设置字体的尺寸 ...

  8. CSS字体样式属性

    font-size 字号大小 一般推荐使用相对长度(px ,em),不推荐使用绝对长度(in,cmm,mm,pt) font-family 字体 1.可以同时指定多个字体,中间用英文状态的逗号隔开,英 ...

  9. html网页什么样的字体最好看，css设置各种中文字体样式代码

    css代码如下:{ font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,Mi ...

随机推荐

  1. CF #621 div.2

    三连否认跪了 T1 开了第一题水题,一遍交过 /* make by ltao */ #include <iostream> #include <cstdio> #include ...

  2. java面试必问问题总结

    1. 自我介绍 2. get跟load的区别 3. 什么是重载,什么是重写 4. HashTable跟HashMap的区别 5. Jsp九大隐式对象 6. Forword和redirect 的区别 7 ...

  3. 获取redis实例绑定cpu的情况

    redis是一个单线模型的nosql类型的数据库,而目前接触到的服务器大都是多核的,比如8c,16c,32c,64c等等.为了充分利用主机,在一台主机上必然会部署多个redis实例,默认情况cpu会随 ...

  4. [Linux] git add时的注意事项

    git add -A  提交所有变化 git add -u  提交被修改(modified)和被删除(deleted)文件,不包括新文件(new) git add .  提交新文件(new)和被修改( ...

  5. 【58】目标检测之YOLO 算法

    YOLO 算法(Putting it together: YOLO algorithm) 你们已经学到对象检测算法的大部分组件了,在这个笔记里,我们会把所有组件组装在一起构成YOLO对象检测算法.   ...

  6. HTTP Error 502.5 - ANCM Out-Of-Process Startup Failure

    问题: 原因:一般来说是由于.NET Core SDK的版本引起的,此时需要观察项目的所需的版本和本地存在的板本是否一致. 本例中,项目所需的版本是2.2如下图所示 本地存在的版本如下图所示,是不存在 ...

  7. Python 3.8 已发布，现在是切换至新版本的好时机吗？

    Python 3.8 已于前两周正式发布,不过目前大多数开发者主要使用的仍是 Python 3.7.x 或更旧的版本. ! 事实上,立刻切换到使用 Python 3.8 可能会引发一些问题.想知道何时 ...

  8. 咸鱼的ACM之路：动态规划（DP）学习记录

    按挑战程序设计竞赛介绍的顺序记录一遍学习DP的过程. 1. 01背包问题 问题如下: 有N个物品,每个物品(N[i])都有一定的体积(W[i]),和一定的价值(V[i]) 现在给定一个背包,背包的容量 ...

  9. 在iOS下-input[disabled] 颜色变浅兼容&& input[readonly]仍可获取焦点解决方法

    目标:在写input输入框时,想让其只读不写. 环境:在iPhone上 本来用的时readonly,可是readonly,居然可以获取焦点,不能弹出键盘:安卓手机完全木有问题,所以去用了disable ...

  10. 入门移动端混合开发 实战京东 APP（完整更新）

    课程资料获取链接:点击这里 混合开发入门 主流开发方案实战京东移动端APP 无需原生开发基础,也能完美呈现京东商城.本课程融合vue.Android.IOS等目前流行的前端和移动端技术,混合开发经典电 ...