【Python基础】CSS入门

CSS介绍

1. css 的定义

css(Cascading Style Sheet)层叠样式表,它是用来美化页面的一种语言。

没有使用css的效果图

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-kWh101Fs-1597306344731)(D:\tmp\note_img\css1.png)]

使用css的效果图

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-MNtnk2zn-1597306344737)(D:\tmp\note_img\css2.png)]

2. css 的作用

  1. 美化界面, 比如: 设置标签文字大小、颜色、字体加粗等样式。
  2. 控制页面布局, 比如: 设置浮动、定位等样式。

3. css 的基本语法

选择器{

样式规则

}

样式规则:

属性名1:属性值1;

属性名2:属性值2;

属性名3:属性值3;

选择器:是用来选择标签的,选出来以后给标签加样式。

代码示例:

div{ 
    width:100px; 
    height:100px; 
    background:gold; 
}

说明

css 是由两个主要的部分构成:选择器和一条或多条样式规则,注意:样式规则需要放到大括号里面。

4. 小结

  • css 是层叠样式表,它是用来美化网页和控制页面布局的。
  • 定义 css 的语法格式是: 选择器{样式规则}

css 的引入方式

css的三种引入方式

  1. 行内式
  2. 内嵌式(内部样式)
  3. 外链式

1. 行内式

直接在标签的 style 属性中添加 css 样式

示例代码:

<div style="width:100px; height:100px; background:red ">hello</div>

优点:方便、直观。 缺点:缺乏可重用性。

2. 内嵌式(内部样式)

<head>标签内加入<style>标签,在<style>标签中编写css代码。

示例代码:

<head>
   <style type<
  • 1
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值