关于CSS:官网(w3school 在线教程)
因为是想学习一下关于CSS和CSS3,所以写了这个笔记。可能会穿插的写两者。(也可以去看官网,本文章只是作为自己的一个笔记,以下内容为本人没掌握或者掌握不熟悉的)。
一、区别
指代不同:
1、CSS3是CSS(层叠样式表)技术的升级版本。
2、CSS是一种用来表现HTML文本样式的计算机语言。
内容不同:
1、CSS3主要包括盒子模型、列表模块、超链接方式、语言模块、背景和边框、文字特效、多栏布局等模块。
2、CSS实现各种脚本语言动态地对网页各元素进行格式化。
二、CSS
关于背景
background-attachment:背景附着
1、指定该图像背景滚动或者固定,不会跟随着页面一起变化
2、两种属性:fixed和scroll
fixed:不随页面的滚动而滚动
scroll
以上图片展示为官网上的,可前往官网查看
关于边框
border-style:边框样式
border-style
属性可以设置一到四个值(用于上边框、右边框、下边框和左边框)。border-(边框位置)-style
1、边框样式允许的值有:
-
dotted
- 定义点线边框 -
dashed
- 定义虚线边框 -
solid
- 定义实线边框 -
double
- 定义双边框 -
groove
- 定义 3D 坡口边框。效果取决于 border-color 值 -
ridge
- 定义 3D 脊线边框。效果取决于 border-color 值 -
inset
- 定义 3D inset 边框。效果取决于 border-color 值 -
outset
- 定义 3D outset 边框。效果取决于 border-color 值 -
none
- 定义无边框 -
hidden
- 定义隐藏边框
2、效果如下图:
下方为给边框加上颜色
border-width
:边框宽度
1、 属性指定四个边框的宽度。
2、可以将宽度设置为特定大小(以 px、pt、cm、em 计),也可以使用以下三个预定义值之一:thin、medium 或 thick:
3、示例图:
CSS3
关于文本
white-space:空白
1、属性指定元素内部空白的处理方式。可禁用元素内的文本换行。
CSS 文本效果
text-overflow:文本溢出
clip:会直接做
ellipis:
word-wrap:整字换行
- break-word:允许长单词被打断并换行到下一行
word-break:换行规则
- keep-all:连字符后再打断
- break-all:在任何字符处中断
writing-mode:书写模式
差不多就这些了,其余的查看官网或者可以看看系统学习的视频进行学习