小蔡学Web：[12]class调用CSS样式

2024-11-03 20:56:04

1、首先我们打开DW网页编辑器然后新建一个class.html文件。

2、在<body>标签中输入标签：这个段落采用左对齐的方式，text-align:left 调试网页效果如下图。

3、在网页内部输入css样式如下：<style type="text/罕铞泱殳css">p{ font-size:12px; }p.left{ text-align:left; }/* 左对齐 */</style>

4、在P标签里面用class调用css样式如下：这个段落采用左对齐的方式，text-align:left 调试结果如下：字体变小，往左靠。

5、我们在写入一个标签，然后来不调用.left样式是什么样子的。这个段落采用左对齐的方式，text-锾攒揉敫align:left 这个段落采用右对齐的方式，text-align:right 调试如下图，但是我们从下图中没有明显看到不同，所以再写个css样式做区别。

6、我们在写一个p.right{ text-align:right; }/* 右对齐 */的样式，用class调用，结果如下图。