By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,739 Members | 1,060 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,739 IT Pros & Developers. It's quick & easy.

Accessing An Image From .css

P: n/a
Sorry, but I have tons of questions tonight, but I will post them one by
one.

Using i.e. 6+ and NS 7+

How do you set properties for a pictures from a style sheet?

For example:

<img name="Picture"></img>

<style>
img ??? {
width: 400px;
}
</style>

Is that possible? I have tried all the variations I could think of
img.Picture, #Picture img, img.#Picture, I know you can set properties
for all images by using img {}, but that is as far as I can get. Any
help is appreciated.

Jul 20 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
Heath <hj******@email.moc> wrote:
Is that possible? I have tried all the variations I could think of
img.Picture, #Picture img, img.#Picture, I know you can set properties
for all images by using img {}, but that is as far as I can get. Any
help is appreciated.


Are you trying to set properties for just that one picture? If so, try this:

<img id="mypicture" src="pic.png" alt="a picture of me" width="400"
height="400">

Note the alt attribute for alternate text and the id attribute which will
help identify the element in the CSS. Now, for the style, use:

#mypicture
{
/* various propeties */
}
--
Michael Wilcox
mjwilco at yahoo dot com
Essential Tools for the Web Developer - http://mikewilcox.t35.com
Jul 20 '05 #2

P: n/a
Heath wrote:
Sorry, but I have tons of questions tonight, but I will post them one by
one.

Using i.e. 6+ and NS 7+

How do you set properties for a pictures from a style sheet?

For example:

<img name="Picture"></img>
The closing tag for <img> elements is forbidden. In HTML, just omit it. In
XHTML, use the empty element syntax:

<img src="..." alt="..." />

<style>
img ??? {
width: 400px;
}
</style>

Is that possible? I have tried all the variations I could think of
img.Picture, #Picture img, img.#Picture, I know you can set properties
for all images by using img {}, but that is as far as I can get. Any
help is appreciated.


If you mean how do you select one particular image, in CSS 2 conforming
browsers, you can simply use an attribute selector:

<img src="foo.png" alt="..." />

img[src=foo.png] {
/* Whatever you want here. */
}

However, Internet Explorer is broken and has a large market share, so you'll
have to use an id:

<img src="..." alt="..." id="bar" />

img#bar {
/* Whatever you want here. */
}

Alternatively, if you want to select a group of images, a class would be
more appropriate:

<img src="..." alt="..." class="baz" />

img.baz {
/* Whatever you want here. */
}

Consult any CSS tutorial for information on how you can select elements in
different ways, or better yet, consult the definitive source, the CSS 2
specification:

<URL:http://www.w3.org/TR/REC-CSS2/selector.html>
--
Jim Dabell

Jul 20 '05 #3

P: n/a
In article Heath wrote:
Sorry, but I have tons of questions tonight, but I will post them one by
one.

Using i.e. 6+ and NS 7+ How do you set properties for a pictures from a style sheet?

For example: <img name="Picture"></img>

<style> img[name="Picture"] { width: 400px;
}
</style>
Attribute selector don't work on IE.
Is that possible? I have tried all the variations I could think of
img.Picture, #Picture img, img.#Picture,


None of them is good. first would work if you had class="Picture" on your
image tag, second would work if you had wrapped your image in element
with id="Picture" and last wouldn't work at all.

Use id attribute instead name.

<img id="Picture">

<style>
#Picture { width: 400px;}
</style>

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

Jul 20 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.