css plus icon and border hover changing color simultaneously
According to this demo,I figure out two questions.First one is how to creat the plus icon using pseudo element.Second one is how to change the plus icon color and border color simultaneously,as we known, the basic way is seperately setting the three parts hover stylings. In HTML section,it's basic to build a div classed add without content. In CSS section, there are some points to pay attention. 1.display:inline-block can be contained the plus in the middle of border. 2.color:#ccc is the basic color which is the same one of plus icon and border. 3.transition can change the color for both, because we didn't write down the border color. The main point is the color and border-color is the same,when you didn't specific the border-color. 4.the .add div is the relative,and the :before and :after are absolute which can bulid a crossing. 5.calculating the width and height for plus icon,and moving to shape what we need. 6.when we hover the .add,the only way