html - twitter bootstrap won't change my style -


i have website (java generate html)

enter image description here

i want add twitter bootstrap nicer design, this:

enter image description here

here try:

<html xmlns="http://www.w3.org/1999/xhtml"><head></head><body><h1>delta fresh samples:</h1><p>save date: 12:28:21 31-may-02015</p><div class="jumbotron" id="distance_small"><h3>distance small</h3><a href="http://104.155.3.206:8080/routingmanager/routingrequest?returnjson=true&timeout=60000&to=s%3a-1+d%3afalse+f%3a-1.0+x%3a-71.037345+y%3a42.339466+r%3a-1.0+cd%3a-1.0+fn%3a-1+tn%3a-1+bd%3atrue&returngeometries=true&npaths=3&gpsinfo=-1%2c-1.0e-6%2c-1.0e-6%2c-1.0e-6%2c-71.12079%2c42.331749%2c261%2c10%2c338%2c-1&returnclientids=true&returninstructions=true&hour=11+59&from=s%3a-1+d%3afalse+f%3a-1.0+x%3a-71.12079+y%3a42.331749+r%3a-1.0+cd%3a-1.0+fn%3a59120065+tn%3a18477383+bd%3afalse+st%3awhite%7epl&sameresulttype=true&type=historic_time&clientversion=3.9.4.5&options=avoid_primaries%3afalse%2cignore_realtime_info%3afalse%2cavoid_long_trails%3afalse%2cprefer_same_street%3atrue%2cavoid_trails%3atrue%2cavoid_toll_roads%3afalse%2callow_uturns%3atrue%2cavoid_danger_zones%3afalse%2cuse_extended_instructions%3atrue%2callow_unknown_directions%3atrue%2cprefer_unknown_directions%3afalse">0_1</a><br><a href="http://livemap-tiles1.waze.com/tiles/internal?linegeom=(-71.1208,42.3317,-71.1052,42.3261,-71.0872,42.3354,-71.0570,42.3295,-71.0376,42.3394),(-71.1208,42.3317,-71.0754,42.3311,-71.0617,42.3428,-71.0376,42.3394),(-71.1208,42.3317,-71.0675,42.3525,-71.0376,42.3395)"><img alt="missing livemap" src="http://livemap-tiles1.waze.com/tiles/internal?linegeom=(-71.1208,42.3317,-71.1052,42.3261,-71.0872,42.3354,-71.0570,42.3295,-71.0376,42.3394),(-71.1208,42.3317,-71.0754,42.3311,-71.0617,42.3428,-71.0376,42.3394),(-71.1208,42.3317,-71.0675,42.3525,-71.0376,42.3395)" height="100" width="200"></a><br><span>&nbsp;</span>editor:<span><a title="0_0" href="https:/www.waze.com/editor/?lon=-71.1181994930557&lat=42.33211431130898&zoom=4&segments=66182276,22523498,22542379,69798169,70183731,70136684,22526478,77571254,77571249,83969671,83969602,83969601,83969300,83969562,83969306,83969308,83969311,83969444,22950508,22946295,63734947,63734946,22945044,76103782,61849159,22943314,22945842,22949040,76952893,22958740,22955108,22963930,22963937,61487751,78453835,78453836,78190323,78190322,22966401,22963938,22955881,22952772,22942713,22945900,61574081,22948993,22946660,61574071,67889632,67889631,67889637,22942168,22941119,22939556,22945627,61704033,63784515,69051844,61704023,22959771,78100291,78100305,78100306,75676668,22959690,22947454,22940596,22961456,22958490,22948978,22961457,22963582,65496487,22946251,22964699,74195770,75079286,22964701,22965880,62248964,78100492,78100491,22962630,22951570,22948096,22954294,66161229,66147839,22960015,22949762,22945545,22946824,22951606,22951605,22948122,22946840,22960419,22965961,22960420,22962680,22962685,22962684,22962683,22947641,22961812,22964726,22965877,22965967,22965964,22951601,22946847,22949797,75206339,75206338,22962702,22960433,22948128,22960544,22966245">alt 0</a></span><br><span><a title="0_1" href="https:/www.waze.com/editor/?lon=-71.1181994930557&lat=42.33211431130898&zoom=4&segments=66182276,22523498,22542379,69798169,70183731,70136684,22526478,77571254,77571249,83969671,83969602,83969601,83969300,83969562,83969306,83969308,83969311,83969776,83970667,83970668,83970679,83970678,83969787,83969884,83969791,83969889,83969965,62003149,22966553,22966554,22946589,22954701,22948771,22960706,22952457,22952456,69823920,67646833,22956976,22942713,22945900,61574081,22948993,22946660,61574071,67889632,67889631,67889637,22942168,22941119,22939556,22945627,61704033,63784515,69051844,61704067,61704043,22957408,61704040,72391451,72391452,61724192,61975137,61975144,57602828,61541078,22965716,22949679,22964912,22943804,22965887,22943805,81603700,81603658,22960396,22960397,22965904,22959154,22965764,22964822,22946555,22954865,22962698,22949797,75206339,75206338,22962702,22960433,22948128,22960544,22966245">alt 1</a></span><br><span><a title="0_2" href="https:/www.waze.com/editor/?lon=-71.1181994930557&lat=42.33211431130898&zoom=4&segments=66182276,22523498,22542379,69798169,70183731,70136684,22526478,22551059,22540619,22540617,22521289,22531355,22531357,22523497,77460394,77460392,61690687,67007203,67007202,22959509,22952362,22947304,22946552,73617242,77749675,73617397,22961888,22941066,62110860,83482398,83482876,83482875,22946605,74542235,83482565,83482564,61713972,74882174,74882173,69051742,61975892,65179805,65179806,61713939,77541139,77541140,61975883,22952799,61539504,57601394,22959961,22947692,22959735,22958946,22958947,22958607,22951490,22961077,22964301,22954627,22946241,22963491,76369581,22950499,22966864,22965699,22949657,22962492,22962497,22962496,22946416,22948460,22951483,22948007,22946064,22951140,61459698,22957970,22965738,22954249,22954934,22960321,78858435,22958543,69824727,69824726,22945987,22945859,67102730,77869444,77869443,22966245">alt 2</a></span><br><br></div><div class="jumbotron" id="distance_large"><h3>distance large</h3><a href="http://104.155.3.206:8080/routingmanager/routingrequest?returnjson=true&timeout=60000&to=s%3a-1+d%3afalse+f%3a-1.0+x%3a-71.037345+y%3a42.339466+r%3a-1.0+cd%3a-1.0+fn%3a-1+tn%3a-1+bd%3atrue&returngeometries=true&npaths=3&gpsinfo=-1%2c-1.0e-6%2c-1.0e-6%2c-1.0e-6%2c-71.12079%2c42.331749%2c261%2c10%2c338%2c-1&returnclientids=true&returninstructions=true&hour=11+59&from=s%3a-1+d%3afalse+f%3a-1.0+x%3a-71.12079+y%3a42.331749+r%3a-1.0+cd%3a-1.0+fn%3a59120065+tn%3a18477383+bd%3afalse+st%3awhite%7epl&sameresulttype=true&type=historic_time&clientversion=3.9.4.5&options=avoid_primaries%3afalse%2cignore_realtime_info%3afalse%2cavoid_long_trails%3afalse%2cprefer_same_street%3atrue%2cavoid_trails%3atrue%2cavoid_toll_roads%3afalse%2callow_uturns%3atrue%2cavoid_danger_zones%3afalse%2cuse_extended_instructions%3atrue%2callow_unknown_directions%3atrue%2cprefer_unknown_directions%3afalse">0_0</a><br><a href="http://livemap-tiles1.waze.com/tiles/internal?linegeom=(-71.1208,42.3317,-71.1052,42.3261,-71.0872,42.3354,-71.0570,42.3295,-71.0376,42.3394),(-71.1208,42.3317,-71.0754,42.3311,-71.0617,42.3428,-71.0376,42.3394),(-71.1208,42.3317,-71.0675,42.3525,-71.0376,42.3395)"> 

however, can see cannot make class="jumbotron" apply seen in this example. (gray bg color. center of page)

what missing?

in addition, if want style without twitter bootstrap

how advise me this?

you need include bootstrap stylesheet inside <head> tag.

you can use bootstrap cdn :

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 

more info , options : http://getbootstrap.com/getting-started/


Comments

Popular posts from this blog

node.js - Using Node without global install -

How to access a php class file from PHPFox framework into javascript code written in simple HTML file? -

java - Null response to php query in android, even though php works properly -