使用 IntraWeb (10) – CSS   

IW 会把大多数的视觉属性转换为 CSS; 我们主动使用 CSS 要分两步:

第一步:

{通过窗体的 StyleSheet 属性指定要链接的 CSS 文件}procedure TIWForm1.IWAppFormCreate(Sender: TObject);begin  StyleSheet.Filename := \'MyCss1.css\'; //CSS 文件须放在 wwwroot 下//  StyleSheet.URL := \'http://...\';    //外链end;{假如站点级的 CSS ... TIWServerController.OnCreate}procedure TIWServerController.IWServerControllerBaseCreate(Sender: TObject);begin  StyleSheet.Filename := \'MyCss1.css\'; //CSS 文件须放在 wwwroot 下//  StyleSheet.URL := \'http://...\';    //外链end;

第二步:

{为要使用样式的控件指定 Css 属性}procedure TIWForm1.IWAppFormCreate(Sender: TObject);begin  StyleSheet.Filename := \'MyCss1.css\';  IWMemo1.Css := \'Class1\'; //假如 MyCss1.css 中有个 Class1 的类, 如: .Class {font-size: 32px; }  IWMemo1.StyleRenderOptions.RenderFont := False; //一般情况下, 还需要同时调整下 StyleRenderOptions 属性end;{------------------------------------------------------------------关于 StyleRenderOptions 属性: 如果我们给控件使用了 CSS, 就有可能和控件本身的属性发生冲突, 用哪一个呢? 这需要控件的 StyleRenderOptions 属性来决定!它也是个类(IWTypes.TIWStyleRenderOptions < TPersistent < TObject), 该类只有几个布尔属性:property RenderSize: Boolean       //property RenderPosition: Boolean   //property RenderFont: Boolean       //property RenderZIndex: Boolean     //property RenderVisibility: Boolean //property RenderStatus: Boolean     //Enabledproperty RenderPadding: Boolean    //property RenderBorder: Boolean     //property RenderAbsolute: Boolean   //property UseDisplay: Boolean       //当对应值为 False 时才可以使用相应的 CSS.-------------------------------------------------------------------}

CSS 的诸多操作类似与 JavaScript, 譬如:

procedure TIWForm1.IWAppFormCreate(Sender: TObject);begin  IWServerController.HTMLHeaders(\'\');  Self.PreHeader.Add(\'\');  Self.ExtraHeader.Add(\'\');  IWServerController.ContentFiles.Add(\'MyCss4.css\');  Self.ContentFiles.Add(\'MyCss5.css\');end;

有没有可能直接在代码中写入 CSS 呢?

{使用 ExtraTagParams 属性}IWLabel1.ExtraTagParams.Add(\'style = color: #f00; font-size:22px;\');{使用 OnHTMLTag 事件, 需要 uses IWHTMLTag}procedure TIWForm1.IWLabel1HTMLTag(ASender: TObject; ATag: TIWHTMLTag);begin  ATag.AddStringParam(\'style\', \'color: #f00; font-size:22px;\');end;