怎样把引用式样式表改为内联式样式表 ?解决思路

怎样把引用式样式表改为内联式样式表 ?
我不知道标题有没有写明白,连我自己看着标题都觉得怪怪的,

问题是这样的,
我原来是用引用式样式表来引用外部的CSS文件,

HTML code

<link href="css.css" rel="stylesheet" type="text/css" />

css.css的代码

CSS code

#attributes .attributes-list li{display:inline;float:left;width:206px;height:24px;margin-right:20px;overflow:hidden;text-indent:5px;line-height:24px;white-space:nowrap;text-overflow:ellipsis;}

在页面里调用

HTML code

 <div id="attributes" class="attributes"><ul class="attributes-list"><li >产品名称：I9100</li><li >品牌:&nbsp;Samsang</li>......</ul></div>

这样页面可以正常显示

现在我想把引用式样式表改为内联式样式表
于是我在页面里删除了

HTML code

<link href="css.css" rel="stylesheet" type="text/css" />

把调用的地方改为

HTML code

 <div id="attributes" class="attributes"><ul style="display:inline;float:left;width:206px;height:24px;margin-right:20px;overflow:hidden;text-indent:5px;line-height:24px;white-space:nowrap;text-overflow:ellipsis;"><li >产品名称：I9100</li><li >品牌:&nbsp;Samsang</li>......</ul></div>

结果页面显示异常了,
请问要怎样修改呢
先谢谢



[解决办法]
原来写的只是针对li的，
#attributes .attributes-list li{...}
这要写内联就得每个li上加style，但是不建议这样做，建议要真内联就放在页面的head中。
正确的写法：

HTML code

<ul>   <li style="display:inline;float:left;width:206px;height:24px;margin-right:20px;overflow:hidden;text-indent:5px;line-height:24px;white-space:nowrap;text-overflow:ellipsis;">产品名称：I9100</li>   <li style="display:inline;float:left;width:206px;height:24px;margin-right:20px;overflow:hidden;text-indent:5px;line-height:24px;white-space:nowrap;text-overflow:ellipsis;">品牌:&nbsp;Samsang</li>......</ul> 

 

查看更多 下一篇