html+css学习笔记005-font属性0text属性

Mr. 柳上原

发布于 2018-09-05 15:11:18

8140

发布于 2018-09-05 15:11:18

文章被收录于专栏：菜鸟前端工程师

Author：Mr.柳上原

付出不亚于任何的努力
愿我们所有的努力，都不会被生活辜负
不忘初心，方得始终

像我这样的人

最近总是单曲循环的播放着这首《像我这样的人》

听很久都不会觉得腻

或许这首歌最大的魅力就是共鸣

“ 像我这样迷茫的人

像我这样寻找的人

像我这样碌碌无为的人

像我这样孤单的人

像我这样傻的人

像我这样不甘平凡的人

世界上有多少人 ”

<!DOCTYPE html> <!-- 文档类型：标准html文档 -->

<html lang='en'> <!-- html根标签 翻译文字：英文 -->

<head> <!-- 网页头部 -->

<meat charset='UTF-8'/> <!-- 网页字符编码 -->

<meat name='Keywords' content='关键词1,关键词2'/>

<meat name='Description' content='网站说明'/>

<meat name='Author' content='作者'/>

<title>前端59期学员作业</title> <!-- 网页标题 -->

<link rel='stylesheet' type='text/css' href='css/css1.css'/> <!-- 外链样式表 -->

<style type='text/css'> /*内部样式表*/

font:10px/20px 'Microsoft YaHei';
font-family:'Microsoft YaHei'; /* 文字字体 */
font-size:10px; /* 文字大小 %父级的百分比 em父级的倍数 rem整个html的倍数 */
font-weight:bold; /* 文字粗细 bold加粗 nomal不加粗 */
font-style:normal; /* 文字样式 normal不倾斜 italic倾斜 oblique斜体 */
font-variant:small-caps; /* 小型大写字母 */

line-height:20px; /* 文字行高 %文字大小的百分比 1文字大小的倍数 */

color:red; /* 文字颜色 */

text-align:left; /* 文本对齐方式 （left左 center中 right右 justify两端）*/
text-transform:capitalize; /* 文本大小写转换 uppercase转大写 lowercase转小写 capitalize首字母大写 */
text-indent:10px; /* 文本首行缩进 */
text-decoration:underline; /* 文本修饰 underline下划线 line-through中划线 overline上划线 */

letter-spacing:10px; /* 字母间的间距 */
word-spacing:10px; /* 单词间的间距 */
white-space:nowrap; /* 文本不换行 */
word-break:break-all; /* 文本强制换行 */

overflow:hidden; /* 内容溢出的处理方式 hidden隐藏 scroll出现滚动条 auto自适应滚动条 */
overflow-x; /* 定义x轴溢出处理方式，其他轴默认auto */
overflow-y; /* 定义y轴溢出处理方式，其他轴默认auto */

/* 内容自动省略号的方法 
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
*/
/* 第几行省略的方法
overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
 */

</style>

</head>

<body> <!-- 网页主干：可视化区域 -->

<div class='box'>
<ul>
<li></li>
<li></li>
</ul>
</div>

</body>

</html>

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2018.05.21 ，如有侵权请联系 cloudcommunity@tencent.com 删除

html