举报投诉联系我们 手机版 热门标签 鳄鱼CMS
您的位置:鳄鱼CMS > htmlstyle属性的用法 HTML DOM Style fontVariant 属性

htmlstyle属性的用法 HTML DOM Style fontVariant 属性

2023-05-22 14:31

htmlstyle属性的用法 HTML DOM Style fontVariant 属性

htmlstyle属性的用法

htmlstyle属性是一种用于在HTML文档中定义样式的属性。它可以用来指定元素的颜色、字体、大小、位置等样式。htmlstyle属性可以在任何HTML元素上使用,包括表格、表单、图片、文本框等。

<div style="background-color: #FF0000; font-size: 12px;"> 
    这是一个div元素,背景颜色为红色,字体大小为12px 
</div> 

上面的代码中,我们使用了htmlstyle属性来定义div元素的背景颜色和字体大小。这里的“background-color”是CSS属性,而“#FF0000”是CSS值;同样,“font-size”也是CSS属性,而“12px”则是CSS值。

此外,htmlstyle属性还可以用来定义元素的位置。例如:

 
<div style="position: absolute; top: 10px; left: 20px;"> 
    这是一个div元素,相对于浏览器左上角的水平位置为20px;相对于浏览器左上角的竖直位置为10px 
</div> 

在上面的代码中,我们使用了htmlstyle属性来定义div元素的位置。这里的“position”是CSS属性;而“absolute”则是CSS值。此外,还有top、left两个CSS属性分别对应10px、20px两个CSS值。

HTML DOM Style fontVariant 属性

Style fontVariant 属性

Style 对象参考手册 Style 对象

定义和用法

fontVariant 属性设置或返回是否以小型大写字母显示字体。

这意味着所有的小写字母将被转换为大写,但相比其余文本,该字母将是较小的字体尺寸。

语法

设置 fontVariant 属性:

Object.style.fontVariant="normal|small-caps|inherit"

返回 fontVariant 属性:

Object.style.fontVariant

描述
normal 默认。字体是 normal(正常的)。
small-caps 字体显示为小型大写字母。
inherit fontVariant 属性的值从父元素继承。


浏览器支持

Internet ExplorerFirefoxOperaGoogle ChromeSafari

所有主要浏览器都支持 fontVariant 属性。

注意:IE7 及更早的版本不支持 "inherit" 值。IE8 只有规定了 !DOCTYPE 才支持 "inherit"。IE9 支持 "inherit"。


实例

实例

更改字体为小型大写字母:

<html>
<head>
<script>
function displayResult()
{
document.getElementById("p1").style.fontVariant="small-caps";
}
</script>
</head>
<body>

<p id="p1">This is some text.</p>
<br>

<button type="button" onclick="displayResult()">Change font</button>

</body>
</html>



Style 对象参考手册 Style 对象
阅读全文
以上是鳄鱼CMS为你收集整理的htmlstyle属性的用法 HTML DOM Style fontVariant 属性全部内容。
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。
相关文章
  •  OceanBase CREATE RESOURCE UNIT

    OceanBase CREATE RESOURCE UNIT

    2023-04-07

    描述该语句用来创建资源单元配置,描述了分配硬件资源的规格,用于给租户分配硬件资源。格式CREATE RESOURCE UNIT unitname MAX_...

  • 流程控制类指令的功能 OceanBase 流程控制函数

    流程控制类指令的功能 OceanBase 流程控制函数

    2023-05-13

    CASE声明CASE value WHEN [compare-value] THEN result [WHEN [compare-value] THEN result ...] [ELSE result] ENDORCASE WHEN ...

  •  OceanBase ALTER USER

    OceanBase ALTER USER

    2023-06-07 OceanBase ALTER USER

    描述该语句主要用于执行以下操作:修改 OceanBase 用户的密码。锁定或者解锁用户,且被锁定的用户不允许登录。说明必须拥有全局 ...

  •  OceanBase POWER

    OceanBase POWER

    2023-06-03 OceanBase POWER

    ​POWER​函数返回​x​的​y​次幂。语法POWER (x, y)参数参数说明x,yx和y为数值型(NUMBER、FLOAT、BINARY_FLOAT和BINARY_DOU...

  •  OceanBase INITCAP

    OceanBase INITCAP

    2023-04-15 OceanBase INITCAP

    ​INITCAP​函数返回字符串并将字符串中每个单词的首字母大写,其他字母小写。语法INITCAP(c1)参数参数说明c1字符串。字符串类型...

© 2024 鳄鱼CMS eyucms.com 版权所有 联系我们