css属性有哪些类型

css属性类型有:1、html标签;2、CSS文字属性;3、CSS符号属性;4、CSS背景样式;5、CSS表单运用;6、CSS边界样式。

css属性有哪些类型

本教程操作环境:windows7系统、css3版,DELL G3电脑。

css属性类型有:

、html标签

...

登录后复制文字格式化

立即学习“前端免费学习笔记(深入)”;

……列块容器

字体大小变化 想输入的字

字体颜色 想输入的字

字体变粗 想输入的字

字体变斜 想输入的字

字体加下划线 想输入的字

对正中央ㄉ语法

内容

对正左边ㄉ语法

内容

对正右边ㄉ语法

内容

字体删除线 想输入的字

字体设置 想输入的字

打字机字体 想输入的字

上标字 想输入的字

下标字 想输入的字

水平线


换行输入 想输入的字
想输入的字

超链接 链接地的名称

链接地的名称网络邮寄标签

贴图 css属性有哪些类型

跑马灯(循环) 想输入的字

外部文件导入格式标签

CSS外部导入格式:


登录后复制

直接引用:

登录后复制

javascript – 加载外部.js独立文件:


登录后复制

二、CSS文字属性:

color : #999999; /*文字颜色*/

font-family : 宋体,sans-serif; /*文字字体*/

font-size : 9pt; /*文字大小*/

font-style:itelic; /*文字斜体*/

font-variant:small-caps; /*小字体*/

letter-spacing : 1pt; /*字间距离*/

line-height : 200%; /*设置行高*/

font-weight:bold; /*文字粗体*/

vertical-align:sub; /*下标字*/

vertical-align:super; /*上标字*/

text-decoration:line-through; /*加删除线*/

text-decoration:overline; /*加顶线*/

text-decoration:underline; /*加下划线*/

text-decoration:none; /*删除链接下划线*/

text-transform : capitalize; /*首字大写*/

text-transform : uppercase; /*英文大写*/

text-transform : lowercase; /*英文小写*/

text-align:right; /*文字右对齐*/

text-align:left; /*文字左对齐*/

text-align:center; /*文字居中对齐*/

text-align:justify; /*文字分散对齐*/

vertical-align属性

vertical-align:top; /*垂直向上对齐*/

vertical-align:bottom; /*垂直向下对齐*/

vertical-align:middle; /*垂直居中对齐*/

vertical-align:text-top; /*文字垂直向上对齐*/

vertical-align:text-bottom; /*文字垂直向下对齐*/

三、CSS符号属性:

list-style-type:none; /*不编号*/

list-style-type:decimal; /*阿拉伯数字*/

list-style-type:lower-roman; /*小写罗马数字*/

list-style-type:upper-roman; /*大写罗马数字*/

list-style-type:lower-alpha; /*小写英文字母*/

list-style-type:upper-alpha; /*大写英文字母*/

list-style-type:disc; /*实心圆形符号*/

list-style-type:circle; /*空心圆形符号*/

list-style-type:square; /*实心方形符号*/

list-style-image:url(/dot.gif); /*图片式符号*/

list-style-position:outside; /*凸排*/

list-style-position:inside; /*缩进*/

四、CSS背景样式:

background-color:#F5E2EC; /*背景颜色*/

background:transparent; /*透视背景*/

background-image : url(/image/bg.gif); /*背景图片*/

background-attachment : fixed; /*浮水印固定背景*/

background-repeat : repeat; /*重复排列-网页默认*/

background-repeat : no-repeat; /*不重复排列*/

background-repeat : repeat-x; /*在x轴重复排列*/

background-repeat : repeat-y; /*在y轴重复排列*/

指定背景位置

background-position : 90% 90%; /*背景图片x与y轴的位置*/

background-position : top; /*向上对齐*/

background-position : buttom; /*向下对齐*/

background-position : left; /*向左对齐*/

background-position : right; /*向右对齐*/

background-position : center; /*居中对齐*/

五、CSS连接属性:

a /*所有超链接*/

a:link /*超链接文字格式*/

a:visited /*浏览过的链接文字格式*/

a:active /*按下链接的格式*/

a:hover /*鼠标转到链接*/

鼠标光标样式:

链接手指 CURSOR: hand

十字体 cursor:crosshair

箭头朝下 cursor:s-resize

十字箭头 cursor:move

箭头朝右 cursor:move

加一问号 cursor:help

箭头朝左 cursor:w-resize

箭头朝上 cursor:n-resize

箭头朝右上 cursor:ne-resize

箭头朝左上 cursor:nw-resize

文字I型 cursor:text

箭头斜右下 cursor:se-resize

箭头斜左下 cursor:sw-resize

漏斗 cursor:wait

光标图案(IE6) p {cursor:url(“光标文件名.cur”),text;}

六、CSS框线一览表:

border-top : 1px solid #6699cc; /*上框线*/

border-bottom : 1px solid #6699cc; /*下框线*/

border-left : 1px solid #6699cc; /*左框线*/

border-right : 1px solid #6699cc; /*右框线*/

以上是建议书写方式,但也可以使用常规的方式 如下:

border-top-color : #369 /*设置上框线top颜色*/

border-top-width :1px /*设置上框线top宽度*/

border-top-style : solid/*设置上框线top样式*/

其他框线样式

solid /*实线框*/

dotted /*虚线框*/

double /*双线框*/

groove /*立体内凸框*/

ridge /*立体浮雕框*/

inset /*凹框*/

outset /*凸框*/

七、CSS表单运用:

文字方块

按钮

复选框

选择钮

多行文字方块

下拉式菜单 选项1

选项2

八、CSS边界样式:

margin-top:10px; /*上边界*/

margin-right:10px; /*右边界值*/

margin-bottom:10px; /*下边界值*/

margin-left:10px; /*左边界值*/

九、CSS边框空白:

padding-top:10px; /*上边框留空白*/

padding-right:10px; /*右边框留空白*/

padding-bottom:10px; /*下边框留空白*/

padding-left:10px; /*左边框留空白*/

相关教程推荐:链接地的名称

以上就是css属性有哪些类型的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2878443.html

(0)
上一篇 2025年3月10日 19:35:50
下一篇 2025年2月25日 22:50:35

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • CSS3属性如何实现网页中的图标布局?

    CSS3属性如何实现网页中的图标布局? 随着网页设计的日益复杂和多样化,图标在网页设计中的使用变得越来越频繁。而CSS3提供了许多新的属性和功能,使得实现网页中的图标布局更加便捷和灵活。本文将介绍一些常用的CSS3属性,以及如何利用它们来实…

    2025年3月10日
    200
  • 如何利用CSS3属性实现网页文字的环绕效果?

    如何利用CSS3属性实现网页文字的环绕效果? 在现代网页设计中,文字环绕效果是一种常见且有趣的展示方式。通过利用CSS3属性,我们可以轻松实现网页文字的环绕效果。本文将介绍一些常用的CSS3属性以及它们在实现文字环绕效果中的应用。 一、fl…

    2025年3月10日
    200
  • CSS3属性如何实现水平居中和垂直居中?

    CSS3属性如何实现水平居中和垂直居中? 随着网页设计的发展,实现元素的水平居中和垂直居中变得越来越重要。在CSS3中,使用一些属性和技巧可以轻松实现这些布局效果。本文将介绍一些常用的CSS3属性和代码示例,帮助您实现水平居中和垂直居中的效…

    2025年3月10日
    200
  • CSS3属性如何实现网页中的滚动效果?

    CSS3属性如何实现网页中的滚动效果? 导语:随着互联网的发展,网页设计也越来越注重用户体验。在网页设计中,滚动效果是一种非常常见的动画效果。通过使用CSS3属性,我们可以轻松实现各种炫酷的滚动效果,本文将介绍如何使用CSS3属性实现网页中…

    2025年3月10日
    200
  • CSS 内容属性:content、counter 和 quotes

    CSS 内容属性:content、counter 和 quotes 在CSS中,内容属性(content)、计数器属性(counter)和引用属性(quotes)是一些非常有用的特性,它们可以帮助我们增强网页的功能和样式。本文将详细介绍这三…

    2025年3月10日
    200
  • CSS 视觉属性中的字体属性详解:font-family 和 font-size

    CSS(层叠样式表)是网页设计中常用的一种技术。在CSS中,视觉属性是控制网页外观的关键因素之一。本文将重点介绍CSS中的字体属性,包括font-family和font-size,并提供具体的代码示例。 字体在网页设计中起着非常重要的作用,…

    2025年3月10日
    300
  • CSS属性实现响应式图片延迟加载的方法

    CSS属性实现响应式图片延迟加载的方法 在网页开发中,经常会遇到需要加载大量图片的情况,特别是在移动设备上。为了提高页面的加载速度和用户体验,延迟加载(lazy loading)图像成为一种常见的优化方法。 延迟加载是指在页面加载时,只加载…

    2025年3月10日
    200
  • CSS属性实现透明背景效果的技巧

    在网页设计中,透明背景效果是一个非常常见的要素。它可以让文字或图片更容易被看清楚。然而,在实际操作中,我们可能经常会遇到一些效果不理想或无法达到想要的结果的问题。本文将介绍CSS属性实现透明背景效果的技巧,并提供具体的代码示例。 首先,我们…

    2025年3月10日
    200
  • CSS属性实现平滑滚动效果的技巧

    CSS属性实现平滑滚动效果的技巧 在网页设计中,滚动效果被广泛应用于菜单导航、页面到顶部和底部的平滑滚动等方面,使用户体验更加流畅和舒适。本文将介绍一些常用的CSS属性和代码示例,帮助你实现平滑滚动效果。 一、通过CSS属性scroll-b…

    2025年3月10日
    200
  • 实现炫酷滚动效果的CSS属性技巧

    实现炫酷滚动效果的CSS属性技巧,需要具体代码示例 CSS是网页设计中不可或缺的一部分,通过CSS可以实现各种各样的效果来提升网页的交互体验。其中,滚动效果是一种非常常见也非常炫酷的效果,它可以使网页元素以流畅的动画效果滚动到指定位置。本文…

    2025年3月10日
    200

发表回复

登录后才能评论