html 一个div下有很有几个相同的css a:hover 的<a> ,当div失去焦点时，默认激活一个 hover

Posted 2023-04-24

如何实现，

参考技术A js 
点后面是写什么   
比如document.getElementById("xd").style.background = '#0000FF';
document.getElementById("xd").css~~  这里怎么调用 a:hover

你其实应该是想要的，div失去焦点之后，其中一个a自动增加一个样式吧。。

你可以这么定义css

li a:hover,li a.hovercolor:#F00;text-decoration:underline;

比如是这样的。。

你想要的时候，div失去焦点之后，a应该会有跟hover时一样的效果？？

那就可以这么写了。

document.getElementById("xd").className = "hover";//这个hover只是自己取的一个样式名。

参考技术B 额，这个你最好给这些<a>取个类或 id，这样比较好处理。然后css里面对不同的类 或 id 做不同样式。 参考技术C 那你直接定义一个a的样式，然后鼠标经过div模块后，加上hover不就行了？ 参考技术D 你好，div没有失去焦点这一个事件。追问

鼠标out 事件，不管什么事件 ，，这个要怎么实现

追答

你把你的问题再讲明白点，什么叫默认激活一个hover？

追问

当鼠标不在 div上时， 其中一个的样式为 a:hover

追答

你试试哪种有效就用哪个吧，
第一种：
$("#div的id").mouseout(function()
$("a标签的id:eq(你需要的a标签的排位数字-1)").css("a:hover","属性值");
);
第二种：
纯js重写，js里改css伪类很难改。

追问

js
点后面是写什么
比如document.getElementById("xd").style.background = '#0000FF';
document.getElementById("xd").css~~ 这里怎么调用 a:hover

追答

一般开发不会这么写。建议深入学习后再做效果。

几个并排 div 的 CSS/HTML 居中

【中文标题】几个并排 div 的 CSS/HTML 居中

【英文标题】：CSS/HTML centering of several side by side divs

【发布时间】：2012-12-12 02:06:31

【问题描述】：

我正在创建一个需要将几块文本和图片并排放置的网站。但我也希望他们居中。我为这些元素中的每一个都使用了一个设置大小，所以如果有人调整他们的屏幕大小，我希望我的页面不断更改彼此相邻放置的 div 的数量。通常我会使用 float:left;为此，但这不起作用，因为我希望我的页面居中。

所以看起来有点像这样：

________
|1 2 3 4| 
|  5 6  |
|_______|

但是当我调整屏幕大小时，它看起来像这样：

______
|1 2 3|
|4 5 6|
|_____| 

如果我放大它会是这样的：

___________
|1 2 3 4 5 |
|    6     |
|__________|

目前的 css 是这样的：

 div.child
width:23%;
float:left;
height:600px;
padding:0px;
min-width:200px;
max-width:230px;
overflow:hidden;
text-align:center;
border-style:solid;
border-width:5px;
overflow:visible;
display:inline-block;

和

div.parrent
padding:0px;
border-style:solid;
border-top-style:solid;
border-width:5px;
overflow:hidden;
text-align:center;

有人有什么建议吗？

【问题讨论】：

以百分比给出宽度和高度！

提示：当谈到 '0' 的长度时，单位是什么并不重要，因此 CSS 允许您为了简洁起见省略它们：padding:0。为简洁起见，使用简写 border 属性：border:5px solid。如果您想使用百分比宽度而不使用填充和边框破坏您的计算，请使用 box-sizing:border-box and others 以便四个 width:25% 完全填充父项。

【参考方案1】：

将它们全部设为display:inline-block，并将父级设置为text-align:center。

演示1：http://jsfiddle.net/xdEmz/1/

演示2：http://jsfiddle.net/E5sHa/2/

请注意，如果您希望每个项目中的图片居中，您可以：

将图像保留为display:inline（默认）并让text-align:center从父级流过，并使用显式<br>强制在它们之后换行，或者 您可以将图片设置为display:block（正如我在上面的第二个演示中所做的那样），然后使用margin:0 auto 使它们在其父容器中水平居中。

【讨论】：

@user1930011 不客气。请注意，如果您觉得这个答案已经完全解决了您的问题，您应该mark it as accepted。这有助于我的声誉和您的声誉，并帮助该网站的未来访问者找到对他们有帮助的答案。

【参考方案2】：

使单个元素显示：内联和容器元素与文本对齐中心...这里的示例http://psarink.org/gallery.php

【讨论】：

这个确切的答案已经在两分钟前给出了。请尝试在发布前立即查看给定的答案。

【参考方案3】：

您可以使用min-width 和max-width 和text-align:center 创建一个容器。