HTML连载13-CSS基本格式以及文字相关的属性
一、CSS格式
1.注意点:
(1)style标签必须写在head标签的开始标签和结束标签之间(也就是必须和title标签师兄弟关系)
(2)style标签中的属性type属性其实可以不写,默认就是type="text/css"
(3)设置样式是必须按照固定格式来设置,key:value;其中不能省略冒号和分号(最后一个分号的时候可以省略,但是我们不提倡)
二、CSS包括什么?
CSS包括选择器和属性两部分
其中选择器就是标签名称,属性就是属性名称和值
<!--CSS的格式-->
<head>
<style type="text/css">
标签名称:{
属性名称:属性值
......
}
</style>
</head>
三、常见的文字相关的属性
1.规定文字样式的属性
(1)格式:font:normal;
(2)常见取值:i.normal:正常的文字;ii.italic:倾斜的文字
(3)快捷键:(由于我们使用的是wbstorm,在企业开发过程中掌握某些软件的快捷键是很有必要的,可以达到事半功倍的效果)
fs+table代表font-style:italic;
fsn代表font-style:normal;
2.规定文字粗细的属性
(1)格式:font-weight:bolder;
(2)常见的取值:
i.单词取值:
bold加粗;bolder更粗;lighter:细线(注意:默认是细线的格式,并且有的字体加粗是有上限的,并不是能变得更粗)
ii.100-900之间整百的数字。
(3)快捷键:
fw代表font-weight::
fwb代表font-weight:bold;
fwbr代表font-weight:bolder;
3.规定文字大小的属性
(1)格式:font-size:30px;
(2)单位:px,这里是以像素来显示的(pixel),并且这个单位是不能省略的。
(3)常见的取值:数值加单位
(4)快捷键:
i.fz代表font-size:;
ii.fz20代表font-size:20px;
这里面是支持直接加个数字的
4.规定文字字体的属性
(1)格式:font-family;“”微软雅黑”
(2)常见取值:微软雅黑、宋体(默认)、.......(word中有好多中字体)
(3)注意:取值如果是中文的话,一定要用引号来括起来;使用到的取值必须是电脑中提前装好的字体
(3)快捷键:
ff代表:font-family:;(不过在我的webstorm不行,估计版本过低)
<head>
<meta charset="UTF-8">
<title>d60&61_fixed_format_of_CSS&text_attribute</title>
<style>
p{
font-style:italic;
font-weight:900;
font-size:50px;
font-family:"微软雅黑";
}
</style>
</head>
<body>
<!---->
<p>我是一个段落</p>
<hr>
<hr>
<i>被废弃的倾斜</i>
<br>
<b>被废弃的加粗</b>

四、源码:
d60&61_fixed_format_of_CSS&text_attribute
地址:
https://github.com/ruigege66/HTML_learning/blob/master/d60%2661_fixed_format_of_CSS%26text_attribute
2.CSDN:https://blog.csdn.net/weixin_44630050(心悦君兮君不知-睿)
3.博客园:https://www.cnblogs.com/ruigege0000/
4.欢迎关注微信公众号:傅里叶变换,后台回复“礼包”获取Java大数据学习视频礼包。

HTML连载13-CSS基本格式以及文字相关的属性的更多相关文章
- CSS.01 -- 选择器及相关的属性文本、文字、字体、颜色、
与html相比,Css支持更丰富的文档外观,Css可以为任何元素的文本和背景设置颜色:允许在任何元素外围设置边框:允许改变文本的大小,装饰(如下划线),间隔,甚至可以确定是否显示文本. 什么是CSS? ...
- CSS书写格式
转自: https://segmentfault.com/a/1190000005046830 CSS书写格式 1.格式化代码 1.1文件 [建议]:CSS文件使用无BOM的UTF-8编码 1.2缩进 ...
- CSS:CSS 文本格式
ylbtech-CSS:CSS 文本格式 1.返回顶部 1. CSS 文本格式 文本格式 This text is styled with some of the text formatting pr ...
- 在windows中,如何使用cmd命令行窗口正确显示编码为utf-8格式的文字
在windows中,如何使用cmd命令行窗口正确显示编码为utf-8格式的文字呢? 正确的步骤如下: 1, 打开cmd命令行窗口 2, 输入命令 >chcp 65001 数字65001代表的是c ...
- css+div如何解决文字溢出
看到标题你一定很轻易就会想到截断文字加“...”的做法.哈哈,就是这样.其实写这篇日志也只是把这样方法做个记录,因为似乎还有很多人不记得碰到这样的情况该如何处理. 首先,先解释一下,一般用div+cs ...
- CSS 文本格式
整理自:(http://www.w3school.com.cn/css/css_text.asp) Text Color 颜色属性被用来设置文字的颜色. 颜色是通过CSS最经常的指定: 十六进制值 - ...
- 1.纯 CSS 创作一个按钮文字滑动特效 + 弹幕(残缺)
原文地址:1# 视频演示如何用纯 CSS 创作一个按钮文字滑动特效 扩展后地址:https://scrimba.com/c/cJkzMfd HTML代码: <html> <head& ...
- CSS控制图片和文字在同一行显示且对齐的3种方法
CSS控制图片和文字在同一行显示且对齐的3种方法 在 HTML 代码中,有时会需要在文字旁边加上一个图标. 默认情况,是图片置顶对齐,文字置底对齐,所以通常图片高,文字低,不能水平居中对齐. 常见方法 ...
- CSS如何设置换行文字自动对齐
CSS如何设置换行文字自动对齐 如图所示: 代码实现如下: <ul class='warn-page-content'> <li> ...
随机推荐
- windows 7 64位下配置mysql64位免安装版
1.官方网站下载mysql-noinstall-5.1.51-winx64.zip 2.解压到E:\Program Files\MySQL.(路径自己指定) 3.在E:\Program Files\M ...
- win7(64位)彻底卸载mysql,重装不再烦恼
[此文出身]鄙人mysql呆鸟,一时手残卸载了mysql,之后重装,始终在配置的时候始终无法通过(如图),纠结一天之久! 查看大图 在某人的鄙视鞭策下,通过度娘的多种指导及自身的多次尝试,终于在下班前 ...
- python栈--字符串反转,括号匹配
栈的实现: # 定义一个栈类 class Stack(): # 栈的初始化 def __init__(self): self.items = [] # 判断栈是否为空,为空返回True def isE ...
- DDD实战9 经销商领域上下文
1.创建Dealer.Domain 类库项目 2.创建实体和值对象 3.安装ef的包 4.创建上下文接口(IDealerContext)之所以要创建上下文接口,是为了可替换,在其他项目总使用接口,当需 ...
- JAVA如何设置代理server,s取消代理erver
1.一个简短的引论 代理server(Proxy Server)是一种重要的server安全功能,它的工作主要在开放系统互联(OSI)模型的会话层,从而起到防火墙的作用. 代理server大多被用来连 ...
- VCL to UniGUI Migration Wizard
Free Evaluation Edition of The Automatic Migration Scripting Wizard For Converting Legacy Delphi Cod ...
- WPF x:static的使用
<Window x:Class="XamlTest.Window1" xmlns="http://schemas.microsoft.com/winf ...
- HALCON 光圈和景深的关系
光圈越大,越亮,景深越小 光圈越小,越暗,景深越大 景深为成像清晰的那个范围
- PySide——Python图形化界面入门教程(三)
PySide——Python图形化界面入门教程(三) ——使用内建新号和槽 ——Using Built-In Signals and Slots 上一个教程中,我们学习了如何创建和建立交互widget ...
- Win8Metro(C#)数字图像处理--2.3图像反色
原文:Win8Metro(C#)数字图像处理--2.3图像反色 [函数名称] 图像反色函数ContraryProcess(WriteableBitmap src) [算法说明] 反色公式如下: ...