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> ...
随机推荐
- opencc 繁体简体互转 （C++）
繁体字通常采用BIG5编码,简体字通常采用GBK或者GB18030编码,这种情况下,直接使用iconv(linux下有对应的命令,也有对应的C API供编程调用)就行.对于默认采用utf-8 ...
- VS2017 安装过程
2017 安装过程 工欲善其事必先利其器 Visual Studio 2017 正式版官方下载地址:https://www.visualstudio.com/downloads/ 安装vs2017的时 ...
- apply plugin: 'idea' --- gradle idea
如果你的项目使用了Gradle作为构建工具,那么你一定要使用Gradle来自动生成IDE的项目文件,无需再手动的将源代码导入到你的IDE中去了. 如果你使用的是eclipse,可以在build.gra ...
- 理解 iOS 和 macOS 的内存管理
在 iOS 和 macOS 应用的开发中,无论是使用 Objective-C 还是使用 swift 都是通过引用计数策略来进行内存管理的,但是在日常开发中80%(这里,我瞎说的,8020 原则嘛
- JSON格式的服务接口
电商接口 京东获取单个商品价格接口: http://p.3.cn/prices/mgets?skuIds=J_商品ID&type=1 用例 ps:商品ID这么获取:http://item.jd ...
- NYOJ 24 素数的距离问题
素数的距离问题 时间限制:3000 ms | 内存限制:65535 KB 难度:2 描写叙述 如今给出你一些数.要求你写出一个程序,输出这些整数相邻近期的素数,并输出其相距长度.假设左右有等距离长 ...
- windows消息值全部定义，从消息值得到消息名称（系统消息定义从0到1023，从1024开始就是WM_USER，但是中间有325个WM_undefined消息，估计是备用，另外各控件都有一些reserved消息，也是为了备用）LostSpeed
前言 在逆向算法扫描插件时, 遇到一个windows消息值在msdn中没有定义. 去查资料, 有个老外将全部windows消息值和消息名称定义都码好了:) 写个测试程序, 封装了一个接口, 从消息值得 ...
- 王立平--RemoteView
RemoteView它将在两个地方被使用:一个是在AppWidget,另外一个是在Notification. RemoteView是用来描写叙述一个垮进程显示的view 1.AppWidget---R ...
- wpf Content数据绑定StringFormat起作用的原理和解决
原文:wpf Content数据绑定StringFormat起作用的原理和解决 <Window x:Class="WpfOne.Bind.Bind6" xmlns=" ...
- .net core 允许跨域
在Startup的ConfigureServices()中添加services.AddCors()在Startup的Configure()中添加app.UseCors(); 保证其在app.UseMv ...