html 字体样式 html好看的字体样式代码 _html好看的字体样式代码

文章插图

文章插图
前两篇文章介绍了创建html文件及常用的标签，今天我们来了解一下常用的样式属性。
废话不多说，跟着橙先生学起来吧！记得要动手操作试试看哦，不能只是看看，当时记住了，也许实际操作时还是不会。
像你家的房间都有大小、功能之分，标签的样式也是同样的。
这里我不讲行内样式、内部样式和外部样式的区别
直接用行内样式做演示，这样比较清楚，待进一步学习后再了解也不迟！
只是书写的方式不同罢了，样式还是那些样式！
我们直接用最具代表性的div标签来做介绍
<div style=”width: 300px; height: 300px;”>这是一个div标签</div>
如上，我们直接在div标签中添加样式，书写形式style=””
所有样式都写在引号中，属性加冒号加值并以分号结束（如width: 300px;）
以下面的实例来一一介绍
<div
style=”
width: 300px;
height: 300px;
border: 5px solid #000000;
background-color: #ffa500;
color: #0000ff;
font-size: 20px;
text-align: center;
font-weight: 700;
line-height: 300px;
“>
这是是一个div标签,以下是橙先生为你做的各个属性介绍
</div>
样式效果
width:是用来定义标签的宽度，单位常用px（像素）
height:用来定义标签的高度，同样常用px单位
border:用来定义标签的边框，如上的5px代表边框的宽度，solid表示是实线（常用的，其他线型不做介绍，自己百度了解），#000000是颜色的十六进制值（这部分也请自行了解）
background-color:用来定义标签的背景颜色，同样用颜色的十六进制值表示
color:用来定义文字的颜色，也是用颜色的十六进制值表示，默认是黑色字
font-size:用来定义字体的大小，常以px为单位
text-align:用来定义文字的水平对齐方式（居中center、左对齐left、右对齐right）
font-weight:用来定义字体的粗细，默认为normal、bold加粗(常用，或700)、bolder更粗、lighter更细，100、200、300、至900定义由粗到细的字符。400 等同于 normal，而 700 等同于 bold 。
line-height:如果数值和height的值相同时，是垂直居中对齐
【html 字体样式 html好看的字体样式代码】以上样式都了解了吗？动动手试试吧！相信你会有更深刻且不一样的认识，今天就介绍到这里，每天进步一点点！下一篇我们进一步介绍其他标签的特殊样式属性！