|
HTML - Help With Fonts
Hi all,
This is my first post here. I was wondering if anyone can give me some advice on some goof looking fonts I can use in my HTML documents. I would like to hear some suggestions on fonts that look good when they are small like 8pt. I'm use Verdana and it looks good for the most part, but I see some websites where they have small bold fonts that look good. Some examples I was looking at were target.com, sears.com etc... I would appreciate any ideas. Thanks Similar Tutorialssoak digital did a great helping me! thanks! (sorry for the added post, i had a question but i answered it myself. D'OH!) Hi all.... Ive been having issues trying to get these two lists below to look the same. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="language" content="english">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>MESH, Inc. - Home</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div id="container">
<img id="banner" src="images/topbanner.png" alt="top banner">
<ul id="top-nav">
<li><a href="mcad_project.html">mcad<span id="mcad"></span></a></li>
<li><a href="niosh_project.html">niosh<span id="nios"></span></a></li>
<li><a href="mcad_project.html">mcad<span id="moad"></span></a></li>
<li><a href="mcad_project.html">mcad<span id="scad"></span></a></li>
<li><a href="cloud_mapping.html">cloud<span id="clou"></span></a></li>
<li><a href="cloud_mapping.html">cloud?<span id="what"></span></a></li>
</ul>
<ul id="nav">
<li><a id="active" href="home.html">Home</a></li>
<li><a href="products.html">Products</a></li>
<li><a href="services.html">Engineering Services</a></li>
<li><a href="projects.html">Projects</a></li>
<li><a href="publications.html">Publications</a></li>
<li><a href="contact_us.html">Contact Us</a></li>
<li><a href="about_us.html">About Us</a></li>
</ul>
<div id="content">
<div align="center"><span style="font-weight:bold;">ENGINEERING SERVICES</span></div><br>
<p>
Since 1978, MESH has been providing clients with engineering services to
solve their most complex problems. We specialize in:
</p>
<ul id="services">
<li>Software and hardware interfaces </li>
<li>Real-Time Software </li>
<li>Prototyping </li>
<li>Sensor Interfacing </li>
<li>Signal Processing </li>
<li>Electronic Design </li>
<li>User Interface and Design</li>
</ul><div align="center"><span style="font-weight:bold;">CHEMICAL/BIOLOGICAL STANDOFF MONITORING PRODUCTS</span></div><br>
<p class="padding-bottom">MESH provides leading edge technology to safeguard people and facilities from chemical and biological hazards. The MESH standoff systems, unlike point detectors, are not dependent on airborne threats finding their way to the detector or sampling point. The standoff sensors include: </p>
<ul id="services2">
<li>MCAD – Standoff sensor for chemical vapors at distances in excess of 6km </li>
<li>Dragonfly – Standoff aerosol sensor (either chemical or biological). </li>
<li>Firefly – Standoff vapor or aerosol hyperspectral imager based on innovative technology, resulting in an affordable approach to the next generation of chemical sensing. </li>
</ul>
</div><!-- end #content -->
<div id="footer">610-932-7754 <a href="mailto:info@meshoxford.com">info@meshoxford.com</a></div>
</div><!-- end #container -->
</body>
</html>
Heres the style sheet.... dont think this is the problem Code: body {
margin:10px;
background-color:#f0f0f0;
font-family:verdana,arial,helvetica,sans-serif;
font-size:16px;
overflow-y:scroll;
}
#container {
width:776px;
margin:auto;
background-image:url(../images/container-white-bg.png);
box-shadow:#333 15px 15px 30px;
}
#banner {
display:block;
width:760px;
height:120px;
padding:8px 8px 0 8px;
background-color:#066;
}
#top-nav {
width:768px;
height:81px;
padding:8px 0 8px 8px;
margin:0;
list-style-type:none;
background-color:#066;
}
#top-nav li {
float:left;
margin-right:8px;
}
#top-nav a,#top-nav span {
position:relative;
display:block;
width:120px;
height:81px;
line-height:81px;
font-size:90%;
font-weight:bold;
color:#000;
text-align:center;
background-color:#cff;
}
#top-nav span {
position:absolute;
top:0;
left:0;
background-image:url(../images/gallery-banner.png);
}
#top-nav span:hover {
opacity:0.5;
filter:alpha(opacity=50);
}
#top-nav a:hover {
text-indent:-9999px;
}
#top-nav #active-top:hover {
text-indent:0;
}
#top-nav a:hover {
text-indent:-9999px;
}
#top-nav #active-top span {
display:none;
}
#mcad {background-position:-8px -8px;}
#nios {background-position:-134px -8px;}
#moad {background-position:-260px -8px;}
#scad {background-position:-386px -8px;}
#clou {background-position:-512px -8px;}
#what {background-position:-638px -8px;}
#nav {
float:left;
width:120px;
padding:0 8px;
margin:0;
list-style-type:none;
background-color:#066;
}
#nav li {
margin-bottom:2px;
}
#nav a {
display:block;
width:120px;
padding:30px 0;
font-size:90%;
font-weight:bold;
color:#000000;
text-align:center;
background-color:#699;
}
#nav a:hover {
color:#fff;
}
#nav #active {
background-color:#cff;
}
#nav #active:hover {
color:#000;
}
#content {
float:left;
width:610px;
padding:25px 15px 10px 15px;
}
h1 {
margin:0 0 10px;
font-size:140%;
text-align:center;
}
#content p {
margin:0 0 10px;
font-size:90%;
color:#000;
}
#services {
font-size:110%;
color:#000;
}
.text-indent {
text-indent:20px;
}
.padding-bottom {
padding-bottom:16px;
}
#footer {
clear:both;
line-height:30px;
font-size:90%;
color:#cff;
text-align:center;
background-color:#066;
}
#footer a {
margin:0 40px;
color:#cff;
}
Thanks Coothead edit: photo of what it looks like in FF Hi, It's the first time I'm using custom fonts on a site, wondering why these rows don't work in Internet Explorer? HTML Code: @font-face {
font-family: Myriad Pro;
src: url(fonts/MyriadPro-Regular.otf) format("truetype");
}
@font-face{
font-family: Giddyup Std;
src: url(fonts/GiddyupStd.otf) format("truetype");
}
@font-face{
font-family: Orator Std;
src: url(fonts/OratorStd.otf) format("truetype");
}
Hello! I have a problem with my webpage, only occuring when I am surfing with Firefox. I have an identic code on two different pages, but on one of them the letters look normal, on the other one they are suddenly messed up. At the pictures it can be seen. I have no clue why it is happening... can anyone help? The text is good at for example: http://www.hungarybudapestguide.com/restaurants/ - but if I go in to read about whatever restaurant later described the texts are messed up in Firefox as seen on the picture. How come? Hi, I have the html coding below that shows the bullet point with a caption below it. How would i format the actual bullet point to be a different size and colour to the caption below it? Thanks Code: <ol> <li>abc</li></br> aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <li>abcd</li></br> aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <li>abcde</li></br> aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa </o> is it possible?? it's not working by any approach! i read about htaccess but didn't know how exactly i can use it to embed a font, if it solves firefox problem how can i use it?? here is the code, u will see eveything i tried Code: <!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<LINK REL=FONTDEF SRC="http://www.site.com/CHILLER0.eot">
<style>
@font-face {
font-family: CHILLER0;
font-style: normal;
font-weight: normal;
src: url(http://www.site.com/CHILLER0.eot);
}
@font-face {
font-family: CHILLER0;
font-style: normal;
font-weight: normal;
src: url(http://www.site.com/CHILLER.TTF) format("truetype");
}
.psycho {
font-family: "CHILLER0", Verdana, sans-serif;
font-size: 48px;
color: #000099;
}
</style>
</head>
<body>
<!--[if !IE]> <!-->
<embed type="application/pdms-weft-plugin" font_face="CHILLER" src="http://www.site.com/CHILLER0.eot" hidden="true" pluginspage="http://pakdata.com/products/pdms-weft-plugin" />
<!--<![endif]-->
<p class="psycho">This Looks Embedded to Me</p>
</body>
</html>
really appreciated :hat: Hi. I'm a FP/html/website builder noob. Is there a way to change all fonts/all backgrounds in FP2003/with html? e.g. Is there an easy way to change all fonts in headers, text areas, tables etc from one font to another. Thanks. Hi, I would like to know exactly how do I specify a font and a color for specific head line or titles in a text using HTML. For example what code should I use if I wan't an Italian Cursive, 16th Century font light gray color as a headline. I'm really not using Dreamweaver, I've done everything with HTML, but if you consider it's easier to use CSS, would you tell me how is it done? Thanks a lot. I made a email signature, i used dreamweaver to make it. Looks good when i preview it. But when i add it to email as signature it doesn't show colors or the correct font. I dunno why? Can someone look at source code of my html and see if i made a mistake. Thanx http://users.bigpond.net.au/sublimecreatures/email.html |
|||||||