CSS如何以标签的name属性定位?

jackker 2008-01-21 02:15:54

css中 id可以以

#id{

}
class以
.class{
}

那么name怎么定位?

可以实现吗?

...全文

5205 9 打赏收藏转发到动态举报

写回复

用AI写文章

9 条回复

切换为时间正序

请发表友善的回复…

发表回复

nicholsky 2008-01-27

打赏
举报

css2原来有这种方法，以后的版本全面支持CSS2或CSS3就爽了，CSS能设置好一切页面布局，会少更多更多的JS代码。

yixianggao 2008-01-27

打赏
举报

写个小例子！

L@_@K

<!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>

    <title>dhtml.css.applyStyleByName.html</title>

    <meta name="generator" content="editplus" />

    <meta name="author" content="Gao YiXiang" />

    <meta name="email" content="yixianggao@126.com" />

    <meta name="keywords" content="javascript dhtml dom" />

    <meta name="description" content="I love web development." />

    <style type="text/css">

/* for IE */

/* 自定义命名规则 */

.div_name_hideList

{ 

    display: none; 

}



/* for FF */

div[name="hideList"]

{ 

    display:none; 

}



div

{

    width: 100px;

    height: 100px;

    background-color: red;

}

.blue

{

    background-color: blue;

}

    </style>

</head>

<body>

    <h3>根据name属性设置样式！IE6sp1, FF2 测试可用！</h3>

    <div name="hideList"></div>

    <div class="blue"></div>    

</body>

<script type="text/javascript">

<!--

// For IE.

function applyStyleByName(sClassName)

{

    var a = sClassName.split("_");

    var c = document.getElementsByTagName(a[0]);



    for (var i=0; i<c.length; i++)

    {

        if (c[i][a[1]]==a[2])

        {

            c[i].className = sClassName;

        }

    }

}



applyStyleByName("div_name_hideList");

//-->

</script>

</html>

yixianggao 2008-01-27

打赏
举报

upup,有没有人会实现?
------------------
可以用CSS2中的属性选择符，即

语法：

E [ attr ] { sRules } 

E [ attr = value ] { sRules } 

E [ attr ~= value ] { sRules } 

E [ attr |= value ] { sRules } 



说明：

属性选择符。 

选择具有 attr 属性的 E 

选择具有 attr 属性且属性值等于 value 的 E 

选择具有 attr 属性且属性值为一用空格分隔的字词列表，其中一个等于 value 的 E 。这里的 value 不能包含空格 

选择具有 attr 属性且属性值为一用连字符分隔的字词列表，由 value 开始的 E

但是IE6sp1不支持该语法，而FF2是支持滴！
IE6sp1下要借助js才能实现！

<!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>

    <title> new document </title>

    <meta name="generator" content="editplus" />

    <meta name="author" content="Gao YiXiang" />

    <meta name="email" content="yixianggao@126.com" />

    <meta name="keywords" content="javascript dhtml dom" />

    <meta name="description" content="I love web development." />

    <style type="text/css">

div[name="hideList"]

{ 

    display:none; 

}

div

{

    width: 100px;

    height: 100px;

    background-color: red;

}

    </style>

</head>

<body>

    <!-- FF2 中该div会被隐藏！ -->

    <div name="hideList"></div>

    <div id="" class=""></div>

</body>

</html>