`
geovindu
  • 浏览: 17075 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

User select font-face/color/size/backgroundColor设置 字体,颜色,大小,背景色兼容主流浏览器

 
阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>User select font-face/color/size/backgroundColor设置 字体,颜色,大小,背景色兼容主流浏览器 </title>
<meta name="author" content="Geovin Du 涂聚文"/>
<meta name="Keywords" content="塗聚文  締友計算機信息技術有限公司 "/>
<meta name="Description" content="塗聚文  締友計算機信息技術有限公司 "/>
</head>

<body>
<form>
Font:<select onchange="document.body.style.fontFamily=this[this.selectedIndex].value">
  <option value="">Default</option>
  <option value="Arial">Arial</option>
  <option value="Times New Roman">Times New Roman</option>
  <option value="Courier New">Courier New</option>
  <option value="黑体">黑体</option>
  <option value="宋体">宋体</option>
  <option value="隶书">隶书</option>
  <option value="幼圆">幼圆</option>
  <option value="楷体">楷体</option>
  <option value="微软雅黑">微软雅黑</option>

</select><br/>
Color:<select onchange="document.body.style.color=this[this.selectedIndex].value">
  <option value="">Default</option>
  <option value="Red">Red</option>
  <option value="Green">Green</option>
  <option value="Blue">Blue</option>
  <option value="Purple">Purple</option>
</select><br/>
BgColor:<select onchange="document.body.style.backgroundColor=this[this.selectedIndex].value">
  <option value="">Default</option>
  <option value="Red">Red</option>
  <option value="Green">Green</option>
  <option value="Blue">Blue</option>
  <option value="Purple">Purple</option>
</select><br/>

Size:<select onchange="document.body.style.fontSize=this[this.selectedIndex].value">
  <option value="">Default</option>
  <option value="8pt">8pt</option>
  <option value="10pt">10pt</option>
  <option value="12pt">12pt</option>
  <option value="14pt">14pt</option>
  <option value="16pt">16pt</option>
  <option value="18pt">18pt</option>
</select>

</form>
<p>Sample text 塗聚文  締友計算機信息技術有限公司 捷為工作室 涂斯博 涂聚文 赵金红 涂家村 缔友计算机信息技术有限公司 捷为工作室</p>
<div> 不作为的官,都在步步高升,问责成虚设,成卖弄言语的修辞手法,法律只成了制約無勢無錢的窮人!</div>
<p>江西省吉安市永丰县市政花园(市政服务大楼[厅])工程质量及违法违规建筑容积率问题,从县长,市长,省长信箱,省长手机,省委办公厅,工程质量安全监督局,省信访局,住建部稽查办室,住建部仇部长等形同虚设?</p>

</body>

</html>


分享到:
评论

相关推荐

    Java日期选择器测试类.rar

    Java日期选择器,Pallet.backGroundColor = Color.gray; //底色  //月历表格配色----------------//  Pallet.palletTableColor = Color.white; //日历表底色  Pallet.todayBackColor = Color.pink; //今天背景...

    react-native-animated-background-color-view::rainbow: 一个经过修改的 React-Native "View" 组件,当 "color" 属性改变时,它会为它的 "backgroundColor" 设置动画

    React Native 动画背景颜色视图一个经过修改的 React Native View组件,当color属性改变时,它会为它的backgroundColor动画。 适用于 iOS 和 Android。例子安装npm install react-native-animated-background-color-...

    智能证件照微信小程序前端+后端源码

    "pages/select_bg/select_bg", "pages/mine-detail/mine-detail", "pages/more/more" ], "subPackages": [], "window": { "navigationBarTextStyle": "black", "navigationBarBackgroundColor": "#fff", ...

    javascript小技巧

    &lt;tr&gt;&lt;td align=center&gt;&lt;font size=5 color=red face="Arial, Helvetica, sans-serif"&gt;下面为脚本显示区!&lt;/strong&gt;&lt;/font&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td align=left height=110 width=240&gt;下面的信息说明10秒后消失,你也可以...

    wxml2canvas微信根据wxml绘制海报

    ##根据wx.createSelectorQuery()获取wxml的'color','font-size','font-weight','font-family','backgroundColor','border','border-radius','box-sizing','line-height'属性绘制海报。 ##可以设置 1.data-index设置...

    自定义键盘

    按键背景颜色设置 */ - (void)setNumberButtonBackgroundColor:(UIColor *)numberButtonBackgroundColor { _numberButtonBackgroundColor = numberButtonBackgroundColor; for (UIButton *numberButton in self....

    UIButton-BackgroundColor:UIButton的类别或扩展名,用于将纯背景色设置为背景图像

    UIButton的类别或扩展名,用于将纯背景色设置为背景图像。 安装 可可豆 将此添加到您的Podfile pod 'UIButton+BackgroundColor' 用法 导入&lt;UIButton&gt; ,然后可以使用以下命令为您的UIButton设置带有状态的背景色...

    微信小程序-页面配置-顶部导航栏背景色渐变

    自定义tabBar页面的顶部导航栏,并保持导航栏的风格与其他tabBar页面导航栏风格统一,也就是导航栏标题文字排版统一。

    JSS:一个简单的javascript库,可让您更改元素的样式

    /// it means that you need to use backgroundColor instead of background-color /// [examples] //// borderRadius instead of border-radius //// paddingBottom instead of padding-bottom jss ( 'element' , {...

    Android代码-ToastLibrary

    .backgroundColor(int backgroundColor) // Toast content textcolor .textColor(int textColor) // Toast content textsize (in SP), default is 20 .textSize(int size) // Typeface for applying font ...

    漂亮的后台界面模板框架

    if(color=="#ffff00"||color=="yellow"){//区别浏览器对颜色解释 if(tags.length-1&gt;=0){ clearStyle(); tags[tags.length-1].style.background='url(images/tabbg1.gif)'; clearContent(); var cc=tags[tags.length-...

    AS3.0歌词同步频谱原码

    info_txt.backgroundColor = 0xFF9900; info_txt.defaultTextFormat = getFormat(); this.addChild(info_txt); id3_txt = new TextField ; id3_txt.width = 300; id3_txt.selectable = false; ...

    net组件LabelTextbox源码

    "function ltmouseover(ctrl,color)\n" + //当鼠标移入时,调用该方法,ctrl为表格,color为要改变的颜色值 "{\n" + "OldColor = ctrl.style.backgroundColor;\n" + //记录下原来的文档背景颜色 "ctrl....

    js获得网页背景色和字体色的方法

    获得网页的背景色和字体颜色,方法如下: 思想: 通过取得颜色属性值得到的是 rgb 色,不是我们想要的,所以需要将 rgb 色装换为 十六进制色 ,首先获得rgb色 : 代码如下: var rgb = document.getElementById(...

    JavaScript Table行定位效果

    程序用的方法是,从当前td开始找,如果背景是透明的话,就再从父节点中找,直到找到有背景色为止。 一般来说透明的属性值是"transparent",但在chrome里却是"rgba(0, 0, 0, 0)",所以用了一个属性来保存透明值: ...

    ios-一行代码实现提示,也可根据自己的需求自定义.zip

    // 自定义字体大小 config.textSize = 16.f; // 自定义文字颜色 config.textColor = [UIColor colorWithRed:255/255.0 green:75/255.0 blue:113/255.0 alpha:1.0]; // 自定义行间距 config.textLineSpace = 4.f...

    js获取及修改网页背景色和字体色的方法

    本文实例讲述了js获取及修改网页背景色和字体色的方法。分享给大家供大家参考,具体如下: 获得网页的背景色和字体颜色,方法如下: 思想: 通过取得颜色属性值得到的是 rgb 色,不是我们想要的,所以需要将 rgb 色...

    ios-图片浏览器.zip

    //通过简单设置就能实现图片浏览器效果 ShowImageView *showView = [[ShowImageView alloc]init]; [weakSelf.collectionView addSubview:showView]; showView.backgroundColor = [UIColor blackColor]; //消失...

    Select精美下拉框(漂亮)

    + ' scrollbar-face-color:#D4D0C8;' + ' scrollbar-shadow-color:white;' + ' scrollbar-highlight-color:#F6F5F4;' + ' scrollbar-3dlight-color:white' + ' scrollbar-darkshadow-color:#86837E;' + ' scrollbar-...

    纯Javascript的统计图形报表,带实例和详细的说明文档 Highcharts

    shadow 是否设置阴影,需要设置背景色backgroundColor。 false reflow 是否自使用图表区域高度和宽度,如果没有设置width和height时,会自适应大小。 true zoomType 拖动鼠标进行缩放,沿x轴或y轴进行缩放,可以设置...

Global site tag (gtag.js) - Google Analytics