怎样把引用式样式表改为内联式样式表 ?
我不知道标题有没有写明白,连我自己看着标题都觉得怪怪的,
问题是这样的,
我原来是用引用式样式表来引用外部的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 >品牌: 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 >品牌: 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;">品牌: Samsang</li>......</ul>