首页 > 编程知识 正文

js表单样式(js中表单)

时间:2023-12-06 11:46:56 阅读:312483 作者:KCYV

本文目录一览:

  • 1、如何设置SpreadJS表单的单元格
  • 2、如何设置SpreadJS的表格样式
  • 3、如何用js给html表单设置style

如何设置SpreadJS表单的单元格

setValue可以设置单元格的值

setStyle可以设置单元格的样式

setFormula可以设置单元格的公式

setFormatter可以设置单元格的格式

等等,对应不同的需求,可以在单元格上做不同的设置

如何设置SpreadJS的表格样式

设置样式的方式跟html中的css类似,SpreadJS有很多样式的属性,通过设置对应的属性来完成整体样式的设置:

构造一个样式并设置不同的属性, 示例代码如下:

var style = new GC.Spread.Sheets.Style();

style.backColor = 'red';

style.foreColor = 'green';

style.isVerticalText = 'true';

之后可以将此样式设置给单元格, 行, 或者列:

//set style to cell.

sheet.setStyle(5, 5, style, GC.Spread.Sheets.SheetArea.viewport);

//set style to row.

sheet.setStyle(5, -1, style, GC.Spread.Sheets.SheetArea.viewport);

//set style to column.

sheet.setStyle(-1, 5, style, GC.Spread.Sheets.SheetArea.viewport);

样式在不同的层级结构中具有不同的优先级别, 如下: 单元格 行 列。

另外,SpreadJS 支持给样式设置一个名称, 并将这个命名过的样式加入到表单的名称样式集合中。这样让样式的使用和管理更方便。

构造一个名称样式, 并将此样式添加到表单或者 Spread 控件的名称样式集合中。

var style = new GC.Spread.Sheets.Style();

style.name = 'style1';

style.backColor = 'red';

//add to sheet's named style collection.

sheet.addNamedStyle(style);

//add to spread's named style collection.

spread.addNamedStyle(style);

当名称样式添加到表单名称样式集合中后, 可以通过样式的名称找到它:

sheet.getNamedStyle('style1');

spread.getNamedStyle('style1');

如果名称样式不再使用, 你可以将其从名称集合中删除掉:

sheet.removeNamedStyle('style1');

spread.removeNamedStyle('style1');

如何用js给html表单设置style

首先,把CSS和JS标签style属性对照表了解了:

CSS 和 JavaScript 标签 style 属性对照表:

盒子标签和属性对照

CSS语法(不区分大小写) JavaScript语法(区分大小写)

border border

border-bottom borderBottom

border-bottom-color borderBottomColor

border-bottom-style borderBottomStyle

border-bottom-width borderBottomWidth

border-color borderColor

border-left borderLeft

border-left-color borderLeftColor

border-left-style borderLeftStyle

border-left-width borderLeftWidth

border-right borderRight

border-right-color borderRightColor

border-right-style borderRightStyle

border-right-width borderRightWidth

border-style borderStyle

border-top borderTop

border-top-color borderTopColor

border-top-style borderTopStyle

border-top-width borderTopWidth

border-width borderWidth

clear clear

float floatStyle

margin margin

margin-bottom marginBottom

margin-left marginLeft

margin-right marginRight

margin-top marginTop

padding padding

padding-bottom paddingBottom

padding-left paddingLeft

padding-right paddingRight

padding-top paddingTop

颜色和背景标签和属性对照

CSS 语法(不区分大小写) JavaScript 语法(区分大小写)

background background

background-attachment backgroundAttachment

background-color backgroundColor

background-image backgroundImage

background-position backgroundPosition

background-repeat backgroundRepeat

color color

样式标签和属性对照

CSS语法(不区分大小写) JavaScript 语法(区分大小写)

display display

list-style-type listStyleType

list-style-image listStyleImage

list-style-position listStylePosition

list-style listStyle

white-space whiteSpace

文字样式标签和属性对照

CSS 语法(不区分大小写) JavaScript 语法(区分大小写)

font font

font-family fontFamily

font-size fontSize

font-style fontStyle

font-variant fontVariant

font-weight fontWeight

文本标签和属性对照

CSS 语法(不区分大小写) JavaScript 语法(区分大小写)

letter-spacing letterSpacing

line-break lineBreak

line-height lineHeight

text-align textAlign

text-decoration textDecoration

text-indent textIndent

text-justify textJustify

text-transform textTransform

vertical-align verticalAlign

!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"

HTML

HEAD

TITLE New Document /TITLE

/HEAD

script language="javascript"

function validate(){

if (document.all("name").value == ""){

document.all("name").style["borderColor"]="red";//就是这里

return;

}

}

/script

BODY

input type="text" name="name"

/BODY

/HTML

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。