as shown in the figure below, is this underscore written in css or js? Is to put the mouse on, it will show an underline, open f12 to have a look, did not see how to do it.
http://www.sellertree.com/ind.
as shown in the figure below, is this underscore written in css or js? Is to put the mouse on, it will show an underline, open f12 to have a look, did not see how to do it.
http://www.sellertree.com/ind.
this style is generally implemented using the border property of css.
Let's analyze your website:
bottom border style:
check or uncheck the border-bottom attribute to see the effect
: hover :
I believe that after the above debugging and verification, you will know why!
I hope it will be helpful to you!
<div></div>div{
border-bottom:1px solid -sharpfff;
}
div:hover{
border-bottom:1px solid green;
}is obviously not an underscore but a border attribute
css.
border-bottom+hover
it should be noted that when there is no Hover, we should also give border-bottom a height and the color is transparent.
in this way, the Hover will not suddenly come out with a bottom border
to supplement the animation. A simple left-to-right gradient can be realized only by css3. If you want to dynamically distinguish (left to right) (right to left) according to the mouse movement mode, you need to use js to determine the direction of mouse movement
border-bottom on the line
border-bottom: 3px solid-sharp09d170
it would be better with outline, because outline does not affect the size or position of elements like border, and outline does not occupy space.
border can be applied to almost all tangible html elements, while outline is designed for elements such as links, form controls, and ImageMap.
recommend things that can be done with outline
css.
Previous: React-router4.0 routing Jump problem
Next: When the x-axis is the timeline, there are some problems that I don't know how to solve echarts
I got a set of data, which is to choose the type of question. How can I tell if I have chosen the right one answera: "Olympic Games " answerb: "Asian Games " answerc: "Paralympic Games " answerd: "University Games " id: "1772 " question: "f...
what is the current level of support for vw,vh layouts in mobile browsers? ...
apply the transform attribute to a div, and then click it to add a class name, which is also a transform, in the class, but then it moves relative to the original location. How to make her want to move for the current location? ...
modify the markdown file under the ant-design-pro-site site and use the relative path to introduce the picture in the markdowm file. attachment: the picture was originally introduced using the http path. <img src=". images 1.jpg" > ...
Icon shows the red part. Choose how to write the effect in css ....
I have two elements, a parent element and a child element. the parent element rotates N degrees. then I want to move the positioning of the child element, which moves relative to the parent element. how do I calculate the offset value. Let it move re...
there are many div elements with the same class= "demo " class name in the page, but not all of them are in the same parent element. How to use css to select the first div? whose class is demo ...
how to make the content of table not be centered vertically? you can set valign= "top " in html, then how to set it in element The table is centered vertically when it is stretched out, and the working hours are aligned with the one at 8 o clock . ...
error WARNING in configuration The mode option has not been set. Set mode option to development or production to enable defaults for this environment. WARNING in asset size limit: The following asset(s) exceed the recommended size limi...
visual studio what plug-in allows CSS style codes to be displayed from least to more? sort out from least to most as shown in the following figure ...
now you need to make a front-end page for ipad pro2. Ui gave the design drawing 2732 to 2048. Should my page be set to the same size ?...
the desired effect is as shown in the figure above <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title< title> <!--<link href="style.css" r...
JS: $(window).resize(function() { var Ha = $(".webuploader-wrap").width($(".webuploader-wrap").parent().width()); var Hb = Ha - Ha*0.2; $(".webuploader-wrap").height(Hb).width(Ha); $(".webuploader-wrap&q...
A static page is written on the computer, and the text and pictures are displayed vaguely under chrome. I can t bear to look directly at it, but it s okay to display it under Firefox. It is no problem for chrome to open other pages, just write this pag...
A rookie at the front end, get the UI picture and do the website. The following CSS Rem 12pxterCSS Rem 14pxtransCSS Rem 14px; , how on earth should I choose? my current understanding: `CSS Rem 12px;` width= 40rem; `CSS Rem 16px;` width= 30rem; ...
when the left scrolls to the bottom, sliding down causes the right to slide as well ...
I haven t done it. I want to know what the train of thought is . Does first store each section structure as a string, then scroll to the specified location, and execute the following code? is similar to paging loading, but the content and layout of ...
for example: < tr vmurfort = "item in Data " > <td class="red">{{item.td}}< td> < tr > Data = [td:12,td:14] what if I want to add a separate red style for td > 13? ...
this animation seems to be an animation with a height of 0 to 100%. How can it be realized? ...
<tr v-for="item in tableData"> <td :class="same">{{item.td}}< td> < tr> computed:{ same(){ let arr = ???.push( c ); return{ red: arr == [ a , c ] } } } here? It should be the dat...