1. 蓝洛水深首页
  2. 教程
  3. 软件

Python自学Day23 Web前端概述之使用CSS渲染页面

使用CSS渲染页面

简介

  • CSS的作用
  • CSS的工作原理
  • 规则、属性和值

Python自学Day23 Web前端概述之使用CSS渲染页面

  • 常用选择器

Python自学Day23 Web前端概述之使用CSS渲染页面

颜色(color)

  • 如何指定颜色
  • 颜色术语和颜色对比
  • 背景色

文本(text / font)

  • 文本的大小和字型(font-size / font-family)

Python自学Day23 Web前端概述之使用CSS渲染页面

  • 粗细、样式、拉伸和装饰(font-weight / font-style / font-stretch / text-decoration)

Python自学Day23 Web前端概述之使用CSS渲染页面

  • 行间距(line-height)、字母间距(letter-spacing)和单词间距(word-spacing)
  • 对齐(text-align)方式和缩进(text-ident)
  • 链接样式(:link / :visited / :active / :hover)
  • CSS3新属性
    • 阴影效果 – text-shadow
    • 首字母和首行文本(:first-letter / :first-line)
    • 响应用户

盒子(box model)

  • 盒子大小的控制(width / height)

Python自学Day23 Web前端概述之使用CSS渲染页面

  • 盒子的边框、外边距和内边距(border / margin / padding)

Python自学Day23 Web前端概述之使用CSS渲染页面

  • 盒子的显示和隐藏(display / visibility)
  • CSS3新属性
    • 边框图像(border-image)
    • 投影(border-shadow)
    • 圆角(border-radius)

列表、表格和表单

  • 列表的项目符号(list-style)
  • 表格的边框和背景(border-collapse)
  • 表单控件的外观
  • 表单控件的对齐
  • 浏览器的开发者工具

图像

  • 控制图像的大小(display: inline-block)
  • 对齐图像
  • 背景图像(background / background-image / background-repeat / background-position)

布局

  • 控制元素的位置(position / z-index)
    • 普通流
    • 相对定位
    • 绝对定位
    • 固定定位
    • 浮动元素(float / clear)
  • 网站布局
    • HTML5布局

Python自学Day23 Web前端概述之使用CSS渲染页面

  • 适配屏幕尺寸
    • 固定宽度布局
    • 流体布局
    • 布局网格

本文来自这个系列长期转载Python-100-Days ,本文观点不代表蓝洛水深立场,转载请联系原作者。

发表评论

登录后才能评论

联系我们

455922333

在线咨询:
点击这里给我发消息
邮件:me@llss.us

工作时间:大部分和你一样