Menu
Community /Pin to ProfileBookmark
@cootheadJul 19.2021 — #Hi there codewitch,
here is a comprehensive list...
[url=https://developer.mozilla.org/en-US/docs/Web/CSS/Reference#Keyword_index][u][color=#00f][b]MDN[/b] - CSS Reference[/color] [/u][/url]
You can check out browser compatibility for each property here...
[url=https://caniuse.com/][u][color=#00f]Can I Use[/color] [/u][/url]
[i]coothead[/i]
@daveyerwinJul 19.2021 — #@codewitch#1634362 said ...
I am looking for something else. I am looking for list of all CSS attributes for a specific HTML element.
____________________________________________________________
the list will be exceedingly long
try this code ...
@daveyerwinJul 19.2021 — #@codewitch#1634362 said ...
not every HTML element can be styled with every attribute
______________________________________
Can you provide some code example to demonstrate this ?@daveyerwinJul 19.2021 — #<img src="myimage.jpg" style="text-align: right; text-decoration: none" />
in the image tag above there are two attributes src and style
@cootheadJul 19.2021 — #
As CSS properties are forever growing, the
list that you seek would be forever changing. ;)
The [b]MDN[/b] link that I provided has for each
property a section called [b]Formal definition[/b]
that indicates the elements to which the
property may be applied.
For example, let's say you wanted to use the
[i]box-sizing[/i] property, clicking on that item
would take you to this page...
[url=https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing][color=#00f][u]box-sizing[/u][/color] [/url]
Scrolling down the page you come to this section...
[url=https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing#formal_definition][color=#00f][u]Formal definition[/u][/color] [/url]
...which gives this information...
This means, of course, that the property may
be applied to the [i]img element[/i]
The bottom line is this; don't waste your time
seeking lists, instead just check to see if the
CSS effect that you wish to implement can be
applied to the element in question.
[i]coothead[/i]@daveyerwinJul 19.2021 — #@sibert#1634380 said ...
Just wonder what the benefits of [src] and [style] are?
__________________
in this css ...
<style>
[src]{height:44px}
[style]{border-style: groove;
border-color: coral;
border-width: 7px;}
</style>
[src] and [style] are selectors
[src] selects all Elements that have 'src' as an attribute
[style] selects all Elements that have 'style' as an attribute
they have the same benefits as any other CSS Selector
List of attributes in CSS for a given element
Hello. How can I find out a list of attributes a certain HTML element in CSS is styleable?
For example <p> is can be styled with margin-top. Thank you.
Sign in
to post a comment10 Comments(s) ↴
0
@cootheadJul 19.2021 — #Hi there codewitch,here is a comprehensive list...
You can check out browser compatibility for each property here...
[i]coothead[/i]
0
@daveyerwinJul 19.2021 — #I am looking for something else. I am looking for list of all CSS attributes for a specific HTML element.
____________________________________________________________
the list will be exceedingly long
try this code ...
``<i>
</i> <!DOCTYPE html>
<html>
<head>
<style>
[xxx] {
background: yellow;
}
[xxs] {
background: green;
}
</style>
</head>
<body>
<h2>CSS Custom Attribute</h2>
<h1 xxx="top-header">Welcome</h1>
<p xxs="top-text">Hello world!</p>
<p class="topcontent">Are you learning CSS?</p>
</body>
</html><i>
</i>``0
@daveyerwinJul 19.2021 — #not every HTML element can be styled with every attribute
______________________________________
Can you provide some code example to demonstrate this ?
0
@daveyerwinJul 19.2021 — #<img src="myimage.jpg" style="text-align: right; text-decoration: none" />in the image tag above there are two attributes src and style
they can be used for styling ...
``<i>
</i><!DOCTYPE html>
<html>
<style>
[src]{height:44px}
[style]{border-style: groove;
border-color: coral;
border-width: 7px;}
</style>
<body>
<h1>Hello World</h1>
<p >This is a paragraph.</p>
<img src="https://daveyerwin.com/th.jpg" style="text-align: right; text-decoration : none" >
</body>
</html><i>
</i>``0
@cootheadJul 19.2021 — #>@codewitch#1634362
>
>[color=navy]"I am looking for list of all CSS attributes
>for a specific HTML element."[/color]
As CSS properties are forever growing, the
list that you seek would be forever changing. ;)
The [b]MDN[/b] link that I provided has for each
property a section called [b]Formal definition[/b]
that indicates the elements to which the
property may be applied.
For example, let's say you wanted to use the
[i]box-sizing[/i] property, clicking on that item
would take you to this page...
Scrolling down the page you come to this section...
...which gives this information...
>[color=#000][b]Applies to[/b] . . . all elements that accept width or height[/color]
This means, of course, that the property may
be applied to the [i]img element[/i]
The bottom line is this; don't waste your time
seeking lists, instead just check to see if the
CSS effect that you wish to implement can be
applied to the element in question.
[i]coothead[/i]
0
@daveyerwinJul 19.2021 — #Just wonder what the benefits of [src] and [style] are?
__________________
in this css ...
<style>
[src]{height:44px}
[style]{border-style: groove;
border-color: coral;
border-width: 7px;}
</style>
[src] and [style] are selectors
[src] selects all Elements that have 'src' as an attribute
[style] selects all Elements that have 'style' as an attribute
they have the same benefits as any other CSS Selector