文字大小及字体是我们在网页中最常设定跟调整的,在预设的字体中你可能找不到你想要的字体类型,这时候我们可以利用Google font去看看你想要的字体。当然也可以调整你要的语言!
点进去你要的字体後,按下select this style,右边会挑出来它的连结,跟CSS
用法。以下是例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link
href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@900&display=swap"
rel="stylesheet"
>
<style>
h1{
font-family: 'Noto Sans TC', sans-serif;
}
</style>
</head>
<body>
<div>
<h1>标题</h1>
<div><a href="#">超连结</a></div>
<img src="https://picsum.photos/id/237/200/300" alt="">
<p>我的内容我的内容我的内容</p>
</div>
</body>
</html>
记得一定要link喔!不然是会没有效果的。
这样就能成功的改变你的标题字体!另外字体大小也可以调整。要用到的是font-size这个属性。而改变字体的样式就是上面所教的font-family
h1{
font-size: 20px;
font-family: 'Noto Sans TC', sans-serif;
}
px是指像素那要如何知道像素的大小呢?这边有个实用的小工具!
那就是像素尺!刚接触网页的话对像素大小可能会没什麽概念,这时候就用尺量八!
Screen Ruler是我目前在用的像素尺,安装完後就可以来量罗!
这边可以看到我设定的font-size是20px,所以一个字的宽高都会是20像素,不信的话赶快动手下载验证一下吧!
从前几篇文章可以看得出来,笔者对於 kernel mm subsystem 其实很不熟悉啊! 决定调...
今天要谈三个NodeJS的概念,进入新手村的第一个任务:Module、Exports与Require...
在Day13: HTTP这篇的范例中很常看到使用respone对象,而respone对象就是Seve...
我们因为只有一个工程师,做 App 的话跨平台开发是很自然的选项。 在2018年开发时,当初只有 R...
直方图 直方图与上一篇所介绍长条图差别在哪里呢? 直方图通常用来观察连续性资料对於相同属性值的呈现结...