ホームページ > 記事 > ウェブフロントエンド > CSS フォント設定_html/css_WEB-ITnose
CSS フォント設定_html/css_WEB-ITnose
- WBOYオリジナル
- 2016-06-24 11:39:201581ブラウズ
文字色設定: color
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><html> <head> <base href="<%=basePath%>"> </head> <style type="text/css"> div{ color: blue; } a{ color: red; } </style> <body> <div><span>Hello World!</span></div> <a>你好！</a> <p style="color:#D95624;">11111</p> </body></html> 実行結果:
文字サイズ設定: font-size
<pre name="code" class="html"><%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><html> <head> <base href="<%=basePath%>"> </head> <style type="text/css"> div{ font-size: 22pt; } a{ /*浏览器中默认的文本大小是 16 像素。因此 1em 的默认尺寸是 16 像素,同时W3C标准推荐的也是em作为字体大小的度量单位*/ font-size: 1em; } </style> <body> <div>二号字 ，磅值为：22</div> <a>1em的字体</a> <p style="font-size: 32px;">32像素的字体</p> <span style="font-size: 200%">2em的字体</span> </body></html> 実行結果
字体类型：font-family
<pre name="code" class="html"><%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><html> <head> <base href="<%=basePath%>"> </head> <style type="text/css"> div{ /*仿宋*/ font-family:仿宋_GB2312; } a{ /*微软雅黑，宋体*/ font-family : 微软雅黑,宋体; } </style> <body> <div>仿宋_GB2312</div> <a>微软雅黑，宋体</a> <p style="font-family:黑体;">黑体</p> <span style="font-family: Times New Roman;">Times New Roman</span> </body></html> 実行結果:
<img src="http://img.blog.csdn.net/20150807235228635" alt="" />
其它：
<pre name="code" class="html"><%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><html> <head> <base href="<%=basePath%>"> </head> <style type="text/css"> div{ /*文本斜体显示*/ font-style: italic; } a{ /*字体加粗*/ font-weight:bold; } </style> <body> <a>字体加粗</a> <div>文本斜体显示</div> <span style="border-bottom: 1px solid black;">加下划线</span> </body></html> 実行結果:
<img src="http://img.blog.csdn.net/20150807235305830" alt="" />
著作権表示: この記事はブロガーによるオリジナル記事であり、ブロガーの許可なく複製することはできません。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。