Let suppose i have two html pages p1 & p2 and it uses different layouts l1 & l2 respectively. I have to design the two different layouts and i only want to use common ID names. I just tried to let you unde开发者_运维技巧rstand that what i have in my mind, pls conisder js fn too (id does matter when we use js).
commonPage.css
p1 > l1 > #right { width:25%; height:25% .... }
> #left { width:25%; height:25% .... }
p2 > l2 > #right { width:30%; height:35% .... }
> #left { width:30%; height:35% .... }
follwing are html pages :
p1.html
<html> <head> <link rel="stylesheet" href="commonPage.css" type="text/css"/>
</head> <body>
<div id = "l1.right"></div> <div id= "l1.left"></div> </body></html>
p2.html
<html> <head> <link rel="stylesheet" href="commonPage.css" type="text/css"/>
</head> <body>
<div id = "l2.right"></div> <div id= "l2.left"></div> </body></html>
@Edit My Question is : how to write same Id names for many html tags with different properties and it should not affect to each other.
You can't identify HTML elements in a page by the page's file name, so you have to either put the unique styles in style tags in each page, or use IDs/classes for each page.
In p1.html, give your body element an ID of p1, name it p2 in p2.html, name both of your divs right and left respectively, so your HTML looks like this (showing only body contents):
p1.html
<body id="p1">
<div id="right"></div>
<div id="left"></div>
</body>
p2.html
<body id="p2">
<div id="right"></div>
<div id="left"></div>
</body>
Then use these selectors:
#p1 > #right
#p1 > #left
#p2 > #right
#p2 > #left
Class names might fit better
//.... Html
<div class='left1' id='data'>
<div class='left2' id='info'>
your code goes here
</div>
more code goes here
</div>
Css
.left1
{
/*css code here*/
}
.left2
{
/*css code here*/
}
![Interactive visualization of a graph in python [closed]](https://www.devze.com/res/2023/04-10/09/92d32fe8c0d22fb96bd6f6e8b7d1f457.gif)
加载中,请稍侯......
精彩评论