网易极客战记官方攻略_网页开发1_时尚意图(补充)

发布于 2020年3月24日

关卡概览和解法

开始学习如何设计网页的各种元素。

简介

style 标签可以用于 style 各种元素的行为方式。

它遵循一套特殊的规则!

默认代码

    
<-- <style>标签用CSS来设计你的HTML。 -->
<-- 查看提示以获取有关CSS的更多信息! -->
<h1>The News</h1><!-- 为报纸命名。 -->
<h6>Kithgard edition.</h6>
<style>
    h6 {
        text-align: center;
    }
    h1 {
        color: red;
        text-decoration: underline;
        /* 使用文本对齐与中心对齐: */   
    } 
</style>

概览

层叠样式表

级联样式表或 CSS 是网站对网站各个部分进行格式化的方式。

要包含特殊的样式规则,请使用打开和关闭的 style>标签。 注意:style标签与其他 HTML 标签不同! 您在两个标签之间放置的内容与其他 HTML 标签不同!

<style>
/* 这是元素选择器 */
/* 使用{}来包含CSS规则 */
    p {
        /* 属性名称首先出现,然后是应该设置的值。*/
        color: red; 
        /*一定要用A:在名称和值之间。使用A;在最后! */
    }
    /* 选择器 */
    div  { /* 括号{} */
        /* 属性名称:属性值 */
        text-align: center;
        /* 注意:和 ; */
    }
    img {
        width: 100px;
        height: 200px;
    }
</style>

时尚意图 解法

<style>
<!-- <style>标签用CSS来设计你的HTML。 ·-->
<!-- 查看提示以获取有关CSS的更多信息! ·-->
<h1>The News</h1> <!-- 为报纸命名。 -->
<style>
    h1 {
        color: red;
        text-decoration: underline;
        /* 使用文本对齐与中心对齐: */
        text-align: center;
    }
    p {
        text-align:center;
        /* 给所有段落文本一个颜色: */
        /* 颜色可以是紫色,橙色,蓝色等! */
        color: maroon;
    }
</style>>