Write a simple CSS script first
Then, in Asp:bulletedlist, the style is CssClass = "Style1" to the control. Look at the running effect
Notice that the top and bottom borders are colored red and orange, and the right border is green. In this case, the border is not set for the div and border is set for the control asp:bulletedlist. The style of the right border is set for Li, and the color of the Web site text and the underline are set for a. So the problem is, there's no such thing as <li/> and <a/> in the code, why is the. Style1 Li in the style sheet work? This is because ASP. NET will compile the design code into HTML code when it is run, and the style text is also embedded in the Web page source code. Now look at the source code of the webpage:
In the following source code, you can see that the CSS script is exactly the same as the code in the project, but the Asp:bulletedlist control code in the project does not appear in the source code, instead of the UL. This is what sap.net generated after compiling.
In the source code, the CSS style style1 is on the UL, and Li and a are included in the UL, so the style. Style1 Li and. Style1 a respectively control the Li and a in UL, Style1 A:hover is the control when the mouse moves to the site link, The mouse becomes hand-shaped and the text color turns red. A:hover is a CSS pseudo-element that sets special effects on certain selectors. There's a lot of pseudo-elements, and here's the point. Add Display:inline-block in. style1 Li, you can make the links horizontal arrangement, but display:inline-block, not for all browsers are valid, I use 360 fast browser, this can be effective, But what other browsers are invalid or valid temporarily do not know.
There seems to be no property in the control asp:bulletedlist that sets the background picture, which can be set by CSS and added Background-image:url (img/1.png) in. Style1 Li to set the background picture. The URL is the path to the picture.
The CSS script is moved to an external style sheet, and then Background-image:url (img/1.png) needs to be changed by referencing the external style sheet, but when the background image is not displayed at run time, the Background-image:url (/ Img/1.png); that's it.
ASP. NET BulletedList style Modify CSS