20210522车玉霞

                                  **日志**

一、学习内容

1、CSS

层叠样式表,是一种 样式表语言,用来描述 HTML 或 XML文档的呈现。
CSS 描述了在屏幕、纸质、音频等其它媒体上的元素应该如何被渲染的问题。

2、网页三要素:

HTML标签决定页面上元素的基本结构

CSS 用于设置HTML元素的样式

JavaScript 用于控制页面上的行为

3、内联样式

​ 内部样式:可以根据实际情况来确定 style 元素的位置。内部样式使用范围是当前页面(html文件) 。

​ 外部样式表:在使用 外部样式表的情况下,你可以通过改变一个文件来改变整个站点的外观。每个页面使用 标签 链接到样式表。 标签在(文档的)头部:

例:

4、@import 用于从其他样式表导入样式规则 url 表示要引入资源位置

5、样式优先级

内联样式 > 内部样式 和 外部样式 (内部样式和外部样式优先级取决于谁后生效(就近原则))

可以在属性值的后面添加 !important 提升样式的优先级

6、选择器

(1)标记选择器:网页标签名与选择器同名

实例:<!DOCTYPE html>

<head>
    <meta charset="utf-8">
    <title>标签选择器</title>
    <style type="text/css">
    h1{
        color:yellow;
        }
    h2{
        color:red;
    }

</head>



    </style>
</head>
<body>
    <h1>标题一</h1>
    <h2>标题二</h2>
</body>

(2)class选择器

实例:

.success {

color : red ;

}

(3)属性选择器

[attributeName]:拥有 attributeName 属性 的 HTML 元素。

[attributeName=value]:拥有指定属性 且 该属性值仅等于指定值 的 HTML 元素

[attributeName~=value]: 拥有指定属性 且 该属性值包含指定值 的 HTML 元素。

(4)ID选择器

<head>
    <style>
[type=text]

{
color:red;
}




id选择器




6、

常用CSS属性:宽度、高度、边框、外边框、内边框

实例:

<head>
    <meta charset="utf-8"> 
    <title></title> 
    <style> 
    .one { 
        1234567margin-bottom: 50px; 

        }
    .two { margin-top: 30px; 
        } </style> 
        </head> 
        <body>
            <div class="container"> 
            <p class="one">I am paragraph one.</p>
            <p class="two">I am paragraph two.</p>
            </div> 
            </body>
            </html>

二、心得体会

​ 通过今天的学习,了解掌握了网页的设计,根据css的属性学习会了简单的css样式设置。

三、疑问

如何使用css边框属性设计图形后在图形外加一个边框。

标签

© 2021 成都云创动力科技有限公司 蜀ICP备20006351号-1