java中style的用法
在前面的两个单元里我们学习了基本的HTML Tag并且了解了HTML Tag可以有属性。有些Tag，比如说<A>, <IMG> Tag等必须使用属性。属性的存在让HTML Tag更有活性，功能更强大！在这一单元里，我们着重介绍一个很有用的属性——style。
其实，在上一单元中，我们谈到了style的属性。可以用它来对文字进行修饰，包括颜色，大小，位置等等。因为几乎所有的HTML Tag都可以使用style属性，可见其功能极其强大。在第一单元里，我们学了<u>, <b>, <i> Tag。其实，他们可以用style结合<span>或者<div> Tag来表示。
我喜欢<u>顶顶华闻</u>网站
我喜欢<i>顶顶华闻</i>网站
我喜欢<b>顶顶华闻</b>网站
用 span 和 style 来表示<u>，<i>，<b> Tag：
我喜欢<span style="text-decoration:underline;">顶顶华闻</span>网站
我喜欢<span style="font-style:italic">顶顶华闻</span>网站
我喜欢<span style="font-weight:bold">顶顶华闻</span>网站
上面的几个例子用 text-decoration来说明下划线；用font-style来说明斜体，用font-weight 来修饰成为黑体。
下面简单介绍一下style属性来修饰的项目：color, width, height, position, border, background，line-height....
style属性来修饰的项目
color
color: 表示修饰文字颜色。用法为：color:#ff0000 （表示红色）， color:#7f3f00 （表示棕色）
<div style="color:#7f3f00">这行文字的颜色是棕色<div>
<div style="color:#00ff00">这行文字的颜色是绿色<div>
“#7f3f00”和“#00ff00” 前面是一个“#”后面跟了6个数字或者字母，用来表示不同的颜色。
width，height，background
width: 表示修饰部分的宽度。 用法为 width:123px （表示宽度为123 pixels）
height: 表示修饰部分的高度。用法为 height:33px （表示高度为33 pixels）
background: 表示修饰部分的背景颜色。用法为 background:#ff0000 （表示背景颜色为红色）
注意，属性style的值为 width:223px; height:43px; background: #ff0000; color:#00ff00，而这个值又是由一系列“属性:值”表示。每一项“属性:值”用“;”分隔开。
border
border：表示修饰部分的边框，它比较特别。用法为：border:solid 1px #f0f0f0 （表示边框为实心直线，边框的宽度为1px，边框个颜色为#f0f0f0）
这里 style的值为 border:solid 3px #0000ff;color:#000000;background:#ff0000； 第一个说明border（边框），solid表示实心的边框，3px表示边框的宽度为3px，#0000ff 表示边框的颜色为#0000ff（蓝色）。接下来说明color（文字的颜色）为#000000（黑色）。最后一项是background （背景），颜色为#ff0000（红色）
font-weight，line-height
font-weight:表示文字是否用黑体，可以用它来代替<B> Tag。用法为：font-weight:bold（表示黑体） 或者 font-weight:normal（表示正常显示，不用黑体）
line-height：表示修饰部分的行间距。用法为：line-height:24px（表示文字的行间距为24px）
总结：本单元学习了style属性的基本用法，我们可以用它来修饰文字的颜色，大小，位置，背景颜色。也可以用来修是文字的行间距，边框等。style的值包含一系列的“属性:值”，而每一个“属性:值”用“;”来分隔。style中的border分属性比较特别，不是简单的“属性:值”， 而是“属性:值 值 值”，里面的三个值分别是边框特性（虚线，实线），边框宽度，边框颜色。
附录：颜色列表
首先介绍几个最常用的颜色值（颜色数值中的字幕无大小写之分）：
请注意，在使用下面的表格颜色数值时，不要忘记前面加上一个“#”
| EEEEEE | FF00CC | FF66FF | FF00FF |
| DDDDDD | FFCCCC | FF66CC | FF00CC |
| CCCCCC | FFCC99 | FF6699 | FF0099 |
| BBBBBB | FFCC66 | FF6666 | FF0066 |
| AAAAAA | FFCC33 | FF6633 | FF0033 |
| 999999 | FFCC00 | FF6600 | FF0000 |
| 888888 | CCCCFF | CC66FF | CC00FF |
| 777777 | CCCCCC | CC66CC | CC00CC |
| 666666 | CCCC99 | CC6699 | CC0099 |
| 555555 | CCCC66 | CC6666 | CC0066 |
| 444444 | CCCC33 | CC6633 | CC0033 |
| 333333 | CCCC00 | CC6600 | CC0000 |
| 222222 | 99CCFF | 9966FF | 9900FF |
| 111111 | 99CCCC | 9966CC | 9900CC |
| 000000 | 99CC99 | 996699 | 990099 |
| FF0000 | 99CC66 | 996666 | 990066 |
| EE0000 | 99CC33 | 996633 | 990033 |
| DD0000 | 99CC00 | 996600 | 990000 |
| CC0000 | 66CCFF | 6666FF | 6600FF |
| BB0000 | 66CCCC | 6666CC | 6600CC |
| AA0000 | 66CC99 | 666699 | 660099 |
| 990000 | 66CC66 | 666666 | 660066 |
| 880000 | 66CC33 | 666633 | 660033 |
| 770000 | 66CC00 | 666600 | 660000 |
| 660000 | 33CCFF | 3366FF | 3300FF |
| 550000 | 33CCCC | 3366CC | 3300CC |
| 440000 | 33CC99 | 336699 | 330099 |
| 330000 | 33CC66 | 336666 | 330066 |
| 220000 | 33CC33 | 336633 | 330033 |
| 110000 | 33CC00 | 336600 | 330000 |
| FFFFFF | 00CCFF | 0066FF | 0000FF |
| FFFFCC | 00CCCC | 0066CC | 0000CC |
| FFFF99 | 00CC99 | 006699 | 000099 |
| FFFF66 | 00CC66 | 006666 | 000066 |
| FFFF33 | 00CC33 | 006633 | 000033 |
| FFFF00 | 00CC00 | 006600 | 000000 |
| CCFFFF | FF99FF | FF33FF | 00FF00 |
| CCFFCC | FF99CC | FF33CC | 00EE00 |
| CCFF99 | FF9999 | FF3399 | 00DD00 |
| CCFF66 | FF9966 | FF3366 | 00CC00 |
| CCFF33 | FF9933 | FF3333 | 00BB00 |
| CCFF00 | FF9900 | FF3300 | 00AA00 |
| 99FFFF | CC99FF | CC33FF | 990099 |
| 99FFCC | CC99CC | CC33CC | 008800 |
| 99FF99 | CC9999 | CC3399 | 007700 |
| 99FF66 | CC9966 | CC3366 | 006600 |
| 99FF33 | CC9933 | CC3333 | 005500 |
| 99FF00 | CC9900 | CC3300 | 004400 |
| 66FFFF | 9999FF | 9933FF | 003300 |
| 66FFCC | 9999CC | 9933CC | 002200 |
| 66FF99 | 999999 | 993399 | 001100 |
| 66FF66 | 999966 | 993366 | 0000FF |
| 66FF33 | 999933 | 993333 | 0000EE |
| 66FF00 | 999900 | 993300 | 0000DD |
| 33FFFF | 6699FF | 6633FF | 0000CC |
| 33FFCC | 6699CC | 6633CC | 0000BB |
| 33FF99 | 669999 | 663399 | 0000AA |
| 33FF66 | 669966 | 663366 | 000099 |
| 33FF33 | 669933 | 663333 | 000088 |
| 33FF00 | 669900 | 663300 | 000077 |
| 00FFFF | 3399FF | 3333FF | 000066 |
| 00FFCC | 3399CC | 3333CC | 000055 |
| 00FF99 | 339999 | 333399 | 000044 |
| 00FF66 | 339966 | 333366 | 000033 |
| 00FF33 | 339933 | 333333 | 000022 |
| 00FF00 | 339900 | 333300 | 000011 |
| 0099FF | 0033FF | 0099CC | 0033CC |
| 009999 | 003399 | 009966 | 003366 |
| 009933 |
java中style的用法相关推荐
- java中的基本用法
java中的基本用法 关键字:专门用途的字符串 所有java关键字都是小写英文 标识符 java常量 java变量 ■ 作用域:起作用的区域■ 使用前必须先声明,在赋值.使用变量名访问这块区域 jav ...
- Java中getResourceAsStream的用法
Java中getResourceAsStream的用法 首先,Java中的getResourceAsStream有以下几种: 1. Class.getResourceAsStream(String p ...
- Java中getResourceAsStream的用法小结
2019独角兽企业重金招聘Python工程师标准>>> Java中getResourceAsStream的用法小结 一.Java中的getResourceAsStream主要有以下三 ...
- java中substring的用法
2019独角兽企业重金招聘Python工程师标准>>> java中substring的用法 str＝str.substring(int beginIndex);截取掉str从首字母起 ...
- JAVA中Final的用法
JAVA中Final的用法 1. 修饰基础数据成员的final 这是final的主要用途,其含义相当于C/C++的const,即该成员被修饰为常量,意味着不可修改.如java.lang.Math类中的 ...
- php simpledateformat,Java中SimpleDateFormat的用法介绍（代码示例）
本篇文章给大家带来的内容是关于Java中SimpleDateFormat的用法介绍(代码示例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 1.为什么要使用SimpleDateFo ...
- java中demo接人_return的用法_如何理解java中return的用法？
C语言中return用法?(请熟练者进) return是返回值,这个返回值是和函数的类型有关的,函数的类型是什么,他的返回值就是什么 比方主函数intmain() {}这里就必须有一个return,只 ...
- java中native的用法
java中native的用法前言:在查看 Thread.java 文件时,发现有一个 方法比较特殊 private native void start0();概念:native关键字说明其修饰的方法是 ...
- day9：JAVA中while的用法
一.while循环 while循环是先判断条件是否为真,如果条件为真,则执行循环体. 语句形式: while( 循环条件 ){ 一条语句 / 多条语句 ( 循环体 ) } 二.do-while循环 d ...
- Java 中 switch 的用法
Java 中 switch 的用法 1.switch 中的表达式的数据的数据类型为 byte, short, int, char, String(jdk > 1.7支持 String 类型) 2 ...
最新文章
- 亲君圆梦，创业一起来
- Android的几个分析工具
- 光棍节程序员闯关秀过关全攻略
- C语言scanf函数奇遇记
- 智能照明c语言程序,基于单片机的智能照明控制系统设计方案（含AD+源代码）...
- maven中常遇到的一些错误
- 为什么属龙的有二婚命_88属龙的一生婚姻状况详细解析
- 网银安全控件远程代码执行漏洞分析
- Visual Studio2017 MSDN安装
- Landsat 8 数据获取
- HTML网页设计：二、网页的基本标签
- pyhanlp常用功能简单总结
- C++ IO的简单用法
- 292. Nim 游戏（简单题）
- 在bluehost如何使用WHM面板和ssh链接添加附加IP
- ReactiveX文档中文翻译
- python制作猜数字小游戏
- 计算机技术在家庭方面的应用,物联网技术在家庭方面的应用
- 51单片机入学第一课———点亮自己的LED灯珠
- 51单片机学习笔记-2数码管显示