CSS入门学习

Posted 6+3

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了CSS入门学习相关的知识,希望对你有一定的参考价值。

CSS 定位

一、CSS 定位属性简介

  1. CSS 中 position 规定了元素的定位方式
  2. CSS 可以通过设置 position 属性使 html 元素脱离正常文档流布局,从而使元素可以显示在任意位置
    position 属性的可选值包括:
  • relative 相对定位
  • absolute 绝对定位
  • fixed 固定定位
  • static 默认值

二、CSS 相对定位
不脱离文档流布局,只改变自身的位置,文档流原位置遗留空白区域,定位的起始位置为此元素原文档流的位置

三、CSS 绝对定位
脱离文档流布局,遗留下来的空间由后面的元素填充,定位的起始位置为最近的父元素(position不为static),否则为Body文档本身

CSS 浮动

一、CSS 浮动属性简介

  1. CSS float 属性是一个定位属性,用于使元素脱离正常的文档流,并浮动在它的父容器的左侧或右侧 float
  2. 设置元素在水平方向浮动,意味着元素只能左右浮动而不能上下浮动
    float 属性的常用值包括:
  • left 靠左浮动
  • right 靠右浮动
  • none 不浮动
    (float 属性与 position 属性会相互影响,设置时要多加小心

二、CSS 左右浮动

float:left;
float:right;

三、CSS 超链接样式
CSS中可以根据超链接元素的状态,设置不同的样式属性
下面为4种超链接状态:

  • a:link - 正常状态,未访问过的超链接状态
  • a:visited - 已访问过状态,用户已访问过的超链接状态
  • a:hover - 鼠标放上状态,当用户鼠标放在超链接上时状态
  • a:active - 点击状态,超链接被点击的那一刻状态

在这里插入图片描述

以上是关于CSS入门学习的主要内容,如果未能解决你的问题,请参考以下文章

CSS入门学习

CSS入门学习

WEB开发-CSS入门学习总结

[html] 学习笔记-CSS入门基本知识

CSS入门学习

CSS入门学习