如何去掉列表的默认样式

html-css08

如何去掉列表的默认样式,第1张

新建一个html文件,命名为test.html,用于讲解css如何清除li列表默认样式。

请点击输入图片描述

在test.html文件内,使用ul、li标签创建一个列表。

请点击输入图片描述

在test.html文件内,设置ul标签的class属性为mycss。

请点击输入图片描述

在css标签内,通过class设置ul的样式,将list-style属性设置为none,消除列表的默认序号。

请点击输入图片描述

在css标签内,再将padding属性和margin属性消除li列表的内外边距。

请点击输入图片描述

6

在浏览器打开test.html文件,查看实现的效果。

请点击输入图片描述

1.</?font[^><]*>这个只却掉font标签的, 保留除font以外的所有标签, 如<img><p>等等. 同样的你需要去掉其他标签, 只需要将里面的font换你要去掉的;

2.</?[^/?(img)|(p)][^><]*>这个保留(这里我写的保留了img, p这两个标签)你指定的标签,其他的(包括font)全去掉, 如果你还有其他的标签想保留, 直接在里面加一个 |(xxx);

3.</?[a-zA-Z]+[^><]*>这个表达式可以去掉所有HTML的标签;

4.JAVA代码可以这样写:

public static String delTagsFContent(String content){

String patternTag = "</?[a-zA-Z]+[^><]*>"

String patternBlank = "(^\\s*)|(\\s*$)"

return content.replaceAll(patternTag, "").replaceAll(patternBlank, "")

}

清除所有默认样式的css代码:

html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, address, big, cite, code,

del, dfn, em, font, img, ins, kbd, q, s, samp,

small, strike, strong, sub, sup, tt, var,

初始化代码(清除CSS代码):

ul,li{ padding:0margin:0list-style:none}

解析清除ul li样式代码:

相等于分别对ul和li设置padding:0margin:0list-style:none;

padding:0 —— 设置内补白(对象内间距)为0

margin:0 —— 设置对象外间距为0

list-style:none —— 去除自带无序圆点

HTML/javascript

引用外部文件中的js脚本,

<script type="text/javascript" src="ext.js"></script>也可以象下面这样写,language不是必要的,但是推荐上面的写法;

<script language="javascript" type="text/javascript" src="ext.js"></script>

页面内引用:

<script type="text/javascript">//<![CDATA[var x = 0function fn(args) { //...} //]]></script>加上“//<![CDATA[” 和 “//]]>”是为了兼容XHTML,是推荐的写法,HTML时代一般用“<!--”和“//-->”

在一些HTML控件的事件属性中使用(一般事件为onxxx,如onmouseover,onclick,onchange)

<body onload="alert('loaded')"><input type="text" name="username" onclick="alert(this.value)" />在一些HTML控件的非事件属性中使用(注意:一定要加javascript:)

<a href="javascript:void(0)" onclick="alert(this.innerText)">my blog:http://blog.csdn.net/kimsoft</a>

因为各个浏览器默认的样式不同,你这种情况可以使用下面代码清除边距

<style>*{margin:0padding:0}</style>建议做网站的时候,设置个reset.css样式表清除各个浏览器的默认样式,已达到做的网页在各个浏览器中达到统一,下面把YUI

Reset

CSS代码贴出

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {

margin:0

padding:0

}

table {

border-collapse:collapse

border-spacing:0

}

fieldset,img {

border:0

}

address,caption,cite,code,dfn,em,strong,th,var {

font-style:normal

font-weight:normal

}

ol,ul {

list-style:none

}

caption,th {

text-align:left

}

h1,h2,h3,h4,h5,h6 {

font-size:100%

font-weight:normal

}

q:before,q:after {

content:''

}

abbr,acronym { border:0

}